브라우저에는 데이터를 따로 저장할 수 있는 3개의 공간이 있습니다.
Cookie
, Local storage
와 Session storage
의 차이점들을 알아보겠습니다.
Cookie
Cookie
는 백엔드 서버와 데이터를 주고 받을 수 있는 도구입니다. 백엔드에 데이터를 보낼 수 있으며 백엔드에서 데이터를 줄 수 있습니다. API return과는 다른 저장 개념입니다.
📍 특징
- 쿠키는 만료일자를 지정하게 되어 있어 언젠가는 제거 됩니다(만료일자를 지정하지 않을 경우 세션 쿠키 입니다).
- 4KB 이하의 저장공간을 가지고 있습니다.
- 쿠키의 데이터 api 호출에 담을 수 있어 서버에 전송이 가능합니다.
- 클라이언트에서 조작이 불가능합니다.
- 팝업 창에 쓰입니다.
Local Storage
Local Storage
는 저장한 데이터를 지우지 않는 이상 영구적으로 보관이 가능합니다. 도메인마다 별도의 로컬 스토리지가 존재합니다.
📍 특징
- 브라우저를 종료해도 데이터는 보관되어 추후 다시 접속해도 그 데이터를 사용할 수 있습니다.
- Local Storage의 데이터는 api 호출에 담을 수 없어 서버에 전송이 불가능하다.
- 클라이언트에서만 저장 데이터 조회 가능합니다.
- 자동 로그인과 같이 지속적으로 저장해야 하는 데이터에 쓰입니다.
Session Storage
Session Storage
는 브라우저를 닫을 겨우 클라이언트에 관한 정보가 삭제됩니다.
📍 특징
- 데이터가 지속적으로 보관되어 않습니다.
- Session Storage의 데이터는 api 호출에 담을 수 없어 서버에 전송이 불가능하다.
- 클라이언트에서만 저장 데이터 조회 가능합니다.
- 비로그인 장바구니와 같이 일회성 데이터에 쓰입니다.