WEB STORAGE
웹 스토리지란?
HTML5 에는 웹의 데이터를 클라이언트에 저장할 수 있는 새로운 자료구조인 Web Storage 스펙이 포함되어 있다.
Web Storage : 키/값 쌍으로 데이터를 저장하고 키를 기반으로 데이터를 조회하는 패턴.
영구저장소(LocalStorage)와 임시저장소(SessionStorage)를 따로 두어 데이터의 지속성을 구분할 수 있어 응용 환경에 맞는 선택이 가능.
Web Storage는 쿠키와 매우 유사하다!
Web Storage의 차이점 (cookie와 비교)
-
쿠키는 매번 서버로 전송된다.
- 웹 사이트에서 쿠키를 설정하면 이후 모든 웹 요청은 쿠키정보를 포함하여 서버로 전송된다.
- Web Storage는 저장된 데이터가 클라이언트에 존재할 뿐 서버로 전송은 이루어지지 않는다.
-
단순 문자열을 넘어(스크립트) 객체정보를 저장할 수 있다.
- 문자열 기반 데이터 이외에 체계적으로 구조화된 객체를 저장할 수 있다.
-
용량의 제한이 없다
- 쿠키는 개수와 용량에 있어 제한이 있다.
- Web Storage에는 이러한 제한이 없다.
-
영구 데이터 저장이 가능하다.
- 쿠키는 만료일자를 지정하게 되어있어서 언젠가 제거된다.(만료일자를 지정하지 않으면 세션쿠키)
- Web Storage는 만료기간의 설정이 없다. (한번 생성하면 영구적으로 존재)
LocalStorage
- 로컬에 도메인 별로 지속되는 storage
- localStorage는 시간제한이 없고 브라우저가 꺼져도 죽지 않는다.
- 값을 지우려면 직접 지워줘야한다.
SessionStorage
- 세션이(프로세스, 탭, 브라우저) 종료될 때 까지 지속되는 Storage
- SessionStorage는 세션의 종료시 죽음을 맞이한다.
여기서의 세션은 조금은 다른게
세션의 종료는 일반적으로 브라우저의 종료를 뜻하는데
sessionStorage에서 의미하는 세션은 가장 작은 단위인 탭단위를 의미
cookie가 가졌던 근본적인 문제인 도메인 같으면 항상 쿠키를 보낸다는 조건이 sessionStorage를 통해 해소하려 함.
나의 공부 일기