Cookie, Session, LocalStorage

LocalStorage

• LocalStorage 저장한 데이터를 명시적으로 지우지 않는 이상 영구적으로 보관 가능하다.
• 도메인보다 별도로 로컬 스토리지가 생성된다.
• setItem("key", value) --> key, value 추가
• getItem(value) --> value 읽어 오기
• removeItem("key") --> item 삭제
• clear() --> 도메인 내의 localStorage 값 삭제
• length --> 전체 item 갯수
• key() --> index로 key값 찾기

SessionStorage

• 전역 객체의 저장과 조회가 이루어진다.
• 데이터가 지속적으로 보관되지 않는다. 현재 페이지가 브라우징 되고 있는 브라우저 컨텍스트 내에서만 데이터가 유지된다.
• 브라우저가 종료되면 데이터도 같이 지워진다. 브라우저가 종료되면 sessionstorage도 삭제된다.
• 저장: sessionStorage.setItem(key, value) 로컬 스토리지와 동일하다.
• 로컬과 마찬가지로 문자열만 저장이 되기 때문에 문자열을 만들려면 JSON.stringfy()를 사용해야 한다.
• 가져오기: sessionStorage.getItme(key) 로컬 스토리지와 동일하다.
• JSON.parse()를 사용해 문자열을 원래 타입으로 변환하는 과정을 거친다.

Cookie

• 생성: document.cookie = "username=Hz Sinbi";
• 만료날짜 추가 가능 document.cookie = "username=Hz Sinbi; expires=Thu, 19 Dec 2019 12:00:00 UTC";
• 경로 매개변수 추가 가능. 쿠키가 속한 경로를 브라우저에게 알림. (기본값: 쿠키는 현재 페이지에 속함.)
  document.cookie = "username=Hz Sinbi; expires=Thu, 19 Dec 2019 12:00:00 UTC; path=/";