What it is
html5에서 제공하는 API로, key-value 페어를 브라우저에 저장하는데 쓰인다. 하나의 세션은 클라이언트가 브라우저를 종료할 때 까지만 지속된다. 따라서, 이곳에 저장된 객체는 브라우저를 종료하는 동시에 사라지게 되며, 절대 서버에 저장되지 않는다.
같은 URL이더라도, 새로운 탭이나 브라우저를 열면 새로운 세션이 생기게 되는것도 염두해두자.
이곳에 저장된 정보는 개발자툴의 Application > Session Storage 에서 확인이 가능하다.
쿠키보다 더 많은 정보를 저장할 수 있다 (4KB vs 5MB~.)
또한, 쿠키는 모든 HTTP Request에 포함되어 있어 웹서비스 성능에 영향을 줄 수 있다고 한다. (쿠키에 대해서는 추후에 자세히 다룰 예정이다.)
When to use it
서버에 제공하고 싶지 않는 정보들 (JWT, 패스워드, 신용카드정보 등등)을 한 세션 동안 임시로 저장하고 싶을 때.
예를 들어, 로그인 후에 제공되는 토큰같은 경우 해당 사이트 안에서 API를 호출 할때마다 요구되는데, 이러한 정보를 저장하기에 적당하다.
How to use it
Syntax
// to set the session
sessionStorage.setItem('key', 'value')
// to get the value
sessionStorage.getItem('key')
// to remove the key
sessionStorage.removeItem('key')
// to clear the storage
sessionStorage.clear()https://developer.mozilla.org/en-US/docs/Web/API/Window/sessionStorage
https://junsday.tistory.com/45
https://scotch.io/@PratyushB/local-storage-vs-session-storage-vs-cookie
https://junspapa-itdev.tistory.com/38
