Web Storage란?
웹 스토리지 (web storage)는 서버가 아닌, 클라이언트에 데이터를 저장할 수 있도록 지원하는 HTML5의 새로운 기능이다. 웹 스토리지와 쿠키의 기능 자체는 유사하지만, 쿠키는 약 4KB까지 밖에 저장 공간을 이용하지 못하는 반면에 웹 스토리지는 약 5MB까지 저장 공간을 이용할 수 있다.
웹 스토리지에는 로컬 스토리지 (local Storage)와 세션 스토리지 (session Storage)가 있다.
Storage
- 장점
1.서버에 불필요한 데이터를 저장해달라고 요청하지 않아도 된다.
2.용량이 크다- 단점
HTML5를 지원하지 않는 브라우저의 경우 사용 불가
로컬 스토리지 (Local Storage)
로컬 스토리지는 브라우저에 반영구적으로 데이터를 저장하며, 브라우저를 종료해도 데이터가 유지된다. 브라우저 자체에 반영구적으로 데이터가 유지되지만, 도메인 (domain)이 다른 경우에는 로컬 스토리지에 접근할 수 없다.
- 브라우저에 데이터 영구보관이 목적
- 창이 다르더라도 같은 URL이면 같은 데이터를 가져야할때
- 보안적으로 민감한 데이터를 가지고 있지않을때 (ex. page 설정 데이터)
세션 스토리지(Session Storage)
세션 스토리지는 각 세션마다 데이터가 개별적으로 저장된다. 예를 들어, 브라우저에서 여러개의 탭을 실행하면 탭마다 개별적으로 데이터가 저장되는 것이다. 세션 스토리지는 로컬 스토리지와 다르게 세션을 종료하면 데이터가 자동으로 제거되며, 같은 도메인이라도 세션이 다르면 데이터에 접근할 수 없다.
- 창(또는 탭)이 꺼지면 데이터도 같이 소면되어야 할 때
- User Session과 같이 보안에 민감한 데이터를 저장해야 할 때
- 같은 URL인데 창(또는 탭)마다 다른 데이터를 가져야 할 때
로컬 스토리지 (Local Storage) 와 세션 스토리지(Session Storage)의 차이는 영구성이다
cookie ?
쿠키(HTTP cookie)란 하이퍼 텍스트의 기록서(HTTP)의 일종으로서 인터넷 사용자가 어떠한 웹사이트를 방문할 경우 사용자의 웹 브라우저를 통해 인터넷 사용자의 컴퓨터나 다른 기기에 설치되는 작은 기록 정보 파일을 일컫는다.
cookie
- 장점
대부분의 브라우저가 지원- 단점
1.매 HTTP 요청마다 포함되어 api호출로 서버에 부담.
2.쿠키의 용량이 작음
3.암호화 존재 x -> 사용자 정보 도난 위험
참고
https://www.zerocho.com/category/HTML/post/5918515b1ed39f00182d3048
https://untitledtblog.tistory.com/47
https://triplexlab.tistory.com/114
https://jindev-t.tistory.com/107
