Cookie, Local storage, Session storage

우리가 쓰고 있는 브라우저에는 데이터를 저장 할 수 있는 공간이 총 세개가 있는데 그게 바로

Cookie, Local storage, Session storage이다.

지금 당장이라도 브라우저를 열고 콘솔창의 어플리케이션 섹터에
Storage 부분을 보면 확인해볼 수 있다.(콘솔창은 F12 키를 누르면 열린다.)

DB를 사용하지 않고 데이터를 임시적인 용도로 저장 할 때 사용한다는 공통점이 있다.

비교적 이해하기 쉽게 최근에 쓰이는 대표적인 예시를 몇가지 들어보자면

쇼핑몰의 장바구니, 좋아하는 콘텐츠(찜, 좋아요 등 같은 기능들)등
수시로 변경되는 정보를 저장 할 때 또는 홈페이지 내에서 자동 로그인이 될 때 사용된다.

또한 방문자의 이동 경로를 저장 하였다가 이동시에도 사용되고

그 이외 서버에 저장할 필요가 없는 정보들을 저장할 때도 사용되는 만큼 다양한 용도로 쓰인다.

각각의 특징으로는

Cookie

• 브라우저 요청이 있을 경우 자동으로 서버에 전송된다.

• 개수와 용량에 있어 제한이 있고,
  하나의 사이트에서 저장할 수 있는 최대 쿠키 수는 20개 / 하나의 최대 쿠키 사이즈는 4KB로 제한 되어 있다.

• 만료일자를 지정하게 되어 있어 언젠간 제거된다.
  만료일자로 지정된 날짜에 쿠키는 제거된다.
  (만료일자를 지정하지 않으면 세션 쿠키가 된다.)

• 대부분의 브라우저에서 지원되기 때문에 호환성이 좋다는 장점을 가지고 있지만,

• api가 쿠키를 거쳐 한번 더 호출 되기 때문에 쌓이게 되면 서버에 부담이 증가된다.(서버가 느려질 수 있다.)

web storage

(LocalStorage, SessionStorage를 통틀어 부르는 말)
WebStorage는 용량의 제한이 없고, 만료기간의 설정이 없다.

즉 한번 저장한 데이터는 영구적으로 존재

데이터의 지속성과 관련하여 두 가지 용도의 저장소를 제공한다. (LocalStorage, SessionStorage)

LocalStorage

• 브라우저를 종료해도 데이터는 보관되어 다시 접속에도 그 데이터를 사용할 수 있다.
  (저장한 데이터를 지우지 않는 이상 영구적 보관 가능)

• 지속적으로 데이터를 저장해야할 때 쓰임.

• 서버에는 불필요한 데이터를 저장 하지 않으며, 용량이 상당히 큼.

SessionStorage

• 브라우저가 닫힐 때 클라이언트에 대한 정보가 삭제됨.

• 즉 데이터가 지속적으로 보관 되지 않음.

• 클라이언트에서만 저장된 데이터 조회가 가능