less than 1 minute read

Web Storage

Web Storage란 HTML5부터 제공하는 기능으로, 해당 도메인과 관련된 특정 데이터를 서버가 아닌 클라이언트 웹브라우저에 저장할 수 있도록 제공하는 기능이다.

Web Storage의 특징

  1. 서버 전송이 없다.
  2. 단순 문자열을 넘어 객체정보를 저장할 수 있다.
  3. 영구 데이터 저장이 가능하다.
  4. Array, Object형태로 적용하고 싶을 시, JSON.stringify()를 사용해 문자열로 변환하여 저장한다.

사용방법

setItem(“key”, “value”); getItem(“key”); removeItem(“key”); clear()

Session Storage

- 브라우저가 열려있는 한 페이지를 Reload해도 계속 유지된다. 하지만 브라우저를 닫으면 삭제된다.

- Windows 전역 객체의 SessionStorage라는 컬렉션을 통해 저장과 조회가 이루어진다.

- 데이터의 지속성과 액세스 범위에 특수한 제한이 존재한다. Web Storage의 기본 보안처럼 도메인별로 별도로 생성된다. 같은 사이트의 같은 도메인이라도 브라우저가 다르면 서로 다른 영역이 된다. 브라우저 컨텍스트가 다르기 때문이다.

* 브라우저 컨텍스트는 Document를 표시하는 환경을 뜻함. 즉, 브라우저가 불러온 웹페이지라고 생각하면 된다.

Local Storage

- 브라우저를 닫았다가 다시 열어도 계속 유지된다. 저장한 데이터를 명시적으로 지우지 않는 이상 영구적으로 보관이 가능하다.

- 도메인마다 별도로 LocalStorage가 생성된다.

- 도메인만 같으면 전역으로 공유가 가능하다.

- Windows 전역 객체의 LocalStorage라는 컬렉션을 통해 저장과 조회가 이루어진다.

Tags:

Categories:

Updated:

Leave a comment