[JavaScript] Session(세션, feat. SessionStorage), LocalStorage(로컬스토리지), Cookie(쿠키), 사용하기

 

SessionStorage, LocalStorage, Cookie 차이점

HTML5 부터 웹스토리지 기술 시작.

웹스토리지 : 로컬스토리지, 세션스토리지.

웹스토리지는 Key와 Value 형태로 이루어짐.

웹스토리지는 클라이언트에 대한 정보를 저장.

웹스토리지는 로컬에만 정보를 저장, 쿠키는 서버와 로컬에 정보를 저장.

 

---

 

사용법

 

로컬스토리지(localStorage)

값 저장하기

localStorage.A (Key == A)

localStorage.getItem("A")

 

값 가져오기

localStorage.A (Key == A)

localStorage.getItem("A")

---

 

세션스토리지(sessionStorage)

값 저장하기

sessionStorage.A = 1 (Key == A, Value = 1)

sessionStorage.setItem("A", 1)

 

값 가져오기

sessionStorage.A (Key == A)

sessionStorage.getItem("A")

---

쿠키(cookie)

값 저장하기

setCookie("A", 1,5) (Key = A, Value = 1, 유효기간 5초)

 

값 가져오기

getCookie("A") (Key == A)

 

 

참조: https://velog.io/@kler/TIL4-%EB%A1%9C%EC%BB%AC%EC%8A%A4%ED%86%A0%EB%A6%AC%EC%A7%80-%EC%84%B8%EC%85%98%EC%8A%A4%ED%86%A0%EB%A6%AC%EC%A7%80-%EC%BF%A0%ED%82%A4-%EC%A0%95%EB%A6%AC