본문 바로가기
Javascript

[javascript] Local Storage 이용하기

by 프렌치13 2022. 12. 26.

https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage

 

Window.localStorage - Web APIs | MDN

The localStorage read-only property of the window interface allows you to access a Storage object for the Document's origin; the stored data is saved across browser sessions.

developer.mozilla.org

 

왜 사용하는가?

- local storage는 브라우저에서 사용하는 저장소이다. mongodb 나 firebase같은 저장소를 사용하지 않고 간단하게 저장할 것이 있을때 사용한다. Session Storage(브라우저를 닫으면 사라진다.)와는 다르게 직접 지우지 않는다면 영구적으로 사용할 수 있다. json web token을 사용시 저장할때 사용한다던지 로그인시 아이디를 기억하고 싶을때 사용하기 좋다.

 

사용하는 방법

1. local storage에 저장하기 (setItem)

기본적인 저장 법

- localStorage.setItem("key값", 넣을 데이터)

Array 나 Object를 저장하는 법

- localstorage는 문자만 저장이 가능하므로 array나 object를 저장할 시 JSON 형태로 바꿔서 저장해주어야한다.

 

2. local storage에서 데이터가져오기 (getItem)

- localStorage.getItem("key값")

Array 나 Object를 가져오는법

- localstorage에 JSON 형태로 저장되어 있기때문에 JSON으로저장하기 전에 형태로 바꾸어 가져와야한다.

댓글