Window.localStorage
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
localStorage 읽기 전용 속성을 사용하면 Document 출처의 Storage 객체에 접근할 수 있습니다. 저장한 데이터는 브라우저 세션 간에 공유됩니다. localStorage는 sessionStorage와 비슷하지만, localStorage의 데이터는 만료되지 않고 sessionStorage의 데이터는 페이지 세션이 끝날 때, 즉 페이지를 닫을 때 사라지는 점이 다릅니다. ("사생활 보호 모드" 중 생성한 localStorage 데이터는 마지막 "사생활 보호" 탭이 닫힐 때 지워집니다.)
localStorage에 저장한 자료는 페이지 프로토콜별로 구분합니다. 특히 HTTP(http://example.com)로 방문한 페이지에서 저장한 데이터는 같은 페이지의 HTTPS(https://example.com)와는 다른 localStorage에 저장됩니다.
키와 값은 항상 각 문자에 2바이트를 할당하는 UTF-16 DOMString의 형태로 저장합니다. 객체와 마찬가지로 정수 키는 자동으로 문자열로 변환합니다.
구문
myStorage = window.localStorage;
값
예외
SecurityError-
요청이 정책의 결정을 위반했거나, 출처가 유효한 스킴/호스트/포트 튜플이 아닌 경우. 유효하지 않은 튜플은 출처가
file:이나data:스킴을 사용했을 때 발생할 수 있습니다. 예외의 예를 들자면 사용자가 특정 출처의 지속성 데이터를 거부하도록 브라우저를 설정하는 경우가 있습니다.
예제
아래 코드는 현재 도메인의 로컬 Storage 객체에 접근한 후, Storage.setItem()을 사용해 항목 하나를 추가합니다.
localStorage.setItem("myCat", "Tom");
위에서 추가한 localStorage 항목을 읽는 법은 다음과 같습니다.
const cat = localStorage.getItem("myCat");
그리고 제거는 아래와 같습니다.
localStorage.removeItem("myCat");
localStorage 항목의 전체 제거 구문입니다.
localStorage.clear();
참고: 참고: Web Storage API 사용하기 문서에서 전체 예제를 살펴보세요.
명세
| Specification |
|---|
| HTML Standard # dom-localstorage-dev |
브라우저 호환성
BCD tables only load in the browser