cookie란?
Cookie는 데이터이면서, 우리가 현재 사용하는 브라우저에 저장되어있는 것이다. 사용자가 브라우저의 쿠키데이터를 비우거나 금지하지 않는다면 계속해서 유지가 된다.
cookie의 생성
쿠키는 각각의 속성을 다음과 같은 문자열에 넣어 document 객체의 cookie 속성에 입력함으로써 생성할 수 있다.
쿠키문법 - read
document.cookie는 name=value 쌍으로 구성되어있고, 각 쌍은 ;로 구분한다.
이때, 쌍 하나는 하나의 독립된 쿠키를 나타낸다. ;을 기준으로 document.cookie의 값을 분리하면 원하는 쿠키를 찾을 수 있다.
쿠키문법 - write
쿠키 문법 - create
쿠키 문법 - change
document.cookie= 는 getter와 setter같이 동작한다고 이해하면 된다.
setter를 수행할때 모든 쿠키를 덮어쓰지 않고, 명시된 쿠키인 user의 값만 갱신한다.
쿠키 문법 - delete
만료 기간을 과거로 바꾸어 버리면 된다. 단, 쿠키 요소를 삭제할때 반드시 path를 맞춰야 한다. 삭제가 안된다면, 개발자도구에서 쿠키 path를 필히 확인 해 볼것
쿠키 파라미터 - Name 속성과 Value 속성
Name과 Value 속성은 데이터를 저장하고 읽는 데 사용하는 속성이다.
따라서 쿠키를 사용할 때는 Name과 Value 속성을 반드시 지정해야 한다.
쿠키 파라미터 - Expires 속성
Expires 속성은 쿠키의 파기 날짜를 지정하는 속성이다.
Expires 속성에는 GMT 형식이나 UTC 형식으로 날짜를 입력해야 한다.
파기 날짜를 입력하지 않으면 브라우저가 종료될 때 쿠키가 삭제된다.
쿠키 파라미터 - max-age 속성
expires 옵션의 대안으로, 쿠키 만료 기간을 설정할 수 있게 해준다.
현재부터 설정하고자 하는 만료일시까지의 시간을 초로 환산한 값을 설정한다.
쿠키 파라미터 - Secure 속성
Secure 속성을 지정하면 해당 쿠키는 SSL(보안 인증서)을 사용해서만 요청할 수 있다.
쿠키 파라미터 - Domain 속성
Domain 속성을 입력하지 않으면 현재 도메인의 경로로 자동 입력된다.
페이지 요청과 비교해서 도메인의 경로와 Domain 속성이 일치하지 않으면, 쿠키에 접근하는 것을 막으므로 Domain 속성은 건드리지 않는다.
쿠키 파라미터 - Path 속성
Path 속성을 입력하지 않으면 현재 도메인의 경로로 자동 입력된다.
Path 속성은 일부러 지정하는 경우가 많은데 특정 경로(폴더명)를 설정한다.
Path 속성은 /폴더/ 로 설정되는데, 이렇게 설정한 Path 속성이 설정되면 현재 폴더 또는 현재 폴더의 하위에서 접근할 수 있다.
쿠키 파라미터 - HttpOnly 속성
설정 시 자바스크립트에서 쿠키에 접근할 수 없습니다. 쿠키 조작을 방지하기 위해 설정하는 것이 좋다.
localStorage란?
local storage는 웹 브라우저에 데이터를 저장할 수 있는 기능으로, 이 로컬스토리지를 사용하면, 사용자가 브라우저를 닫아도 저장한 데이터를 계속해서 유지할 수 있다.