Web Storage란 HTML5부터 제공하는 기능으로, 해당 도메인과 관련된 특정 데이터를 서버가 아니라 클라이언트 웹브라우저에 저장할 수 있도록 제공하는 기능이다. 쿠키(cookie)와 비슷한 기능이다.
브라우저 저장소란 웹의 데이터를 클라이언트에 저장할 수 있는 자료구조이다.
키/값 쌍으로 데이터를 저장하고 키를 기반으로 데이타를 조회하는 패턴이다.

1. 로컬 스토리지

로컬 스토리지는 저장한 데이터를 명시적으로 지우지 않는 이상 영구적으로 보관이 가능하다. 도메인마다 로컬 스토리지가 별도로 생성된다. Windows 전역 객체의 LocalStorage 컬렉션을 통해 저장과 조회가 이루어

2. 세션 스토리지

세션 스토리지는 데이터의 지속성과 액세스 범위에 특수한 제한이 존재한다.
Windows 전역 객체의 LocalStorage 컬렉션을 통해 저장과 조회가 이루어진다. 그리고 브라우저를 종료하면 사라진다

3. 로컬 스토리지 VS 세션 스토리지 차이점

로컬 스토리지와 세션 스토리지의 차이점은 데이터의 영구성이다.
로컬 스토리지의 데이터는 사용자가 지우지 않는 이상 계속 브라우저에 남아 있고세션 스토리지의 데이터는 윈도우나 브라우저 탭을 닫을 경우 제거된다.
지속적으로 필요한 데이터(자동 로그인 등)는 로컬 스토리지에 저장하고, 잠깐 동안 필요한 정보(일회성 로그인 정보라든가)는 세션 스토리지에 저장하면 된다.

하지만 비밀번호같은 중요한 정보는 절대 저장하면 안된다.
클라이언트에 저장하는 것이기 때문에 언제든지 털릴 수 있다.

4. 쿠키

쿠키는 개수와 용량에 있어 제한을 걸어 두고 있다. 하나의 사이트에서 저장할 수 있는 최대 쿠키 수는 20개이며, 하나의 사이트에서 저장할 수 있는 최대 쿠키 크기는 4KB로 제한되어 있다.
쿠키는 만료 일자를 지정하게 되어 있어 언젠간 제거된다. 만료 일자로 지정된 날짜에 쿠키는 제거되는 것이다. (만료 일자를 지정하지 않으면 세션 쿠키가 된다.)
웹 사이트에서 쿠키를 설정하면 이후 모든 웹 요청은 쿠키 정보를 포함하여 서버로 전송된다.
이러한 쿠키의 단점을 보안하고자 HTML5에서 웹 스토리지가 나왔다.