웹 개발을 접하면 자연스레 접하게 되는 Cookie, Local Storage, Session Storage에 대해서 자세히 알아보려 한다.
Cookie란?
쿠키란 인터넷 사용자가 웹 사이트를 방문할 경우 해당 웹 사이트의 서버를 통해 사용자의 컴퓨터에 설치되는 작은 기록 정보 파일이다.
Cookie의 특징
- 웹 사이트에서 쿠키가 설정되면 이후에 일어나는 모든 웹 요청에 쿠키 정보를 포함시켜 웹 사이트의 서버로 전송된다.
- 하나의 사이트에서 저장할 수 있는 최대 쿠키 수는 20개, 총 크기는 4KB로 제한되어 있다.
- 쿠키는 만료일자를 지정할 수 있어, 지정된 날짜에 자동으로 제거된다.(만료일자를 지정하지 않을 경우 브라우저가 닫힐 때 쿠키도 같이 제거된다.)
- 쿠키에 대해 HttpOnly 플래그를 true로 설정할 경우, 쿠키에 대한 클라이언트 측에서의 액세스가 차단된다.
Cookie의 장단점
장점
서버에 대한 저장공간을 절약할 수 있다.
단점
매 요청시마다 Http Header에 쿠키에 대한 정보가 추가되기 때문에 상당한 트래픽이 발생한다.
요청시 쿠키 값을 그대로 보내므로 보안에 취약하다.
Local Storage란?
HTML5에서 포함된 WebStorage 스펙중 하나로 웹 사이트의 데이터를 클라이언트에 저장할 수 있는 방식이다. 한번 저장한 데이터는 지우기 전까지 영구적으로 보존되며 자동 로그인과 같은 경우에 사용된다.
Local Storage의 특징
- LocalStorage는 데이터를 지우지 않는 이상 영구적으로 존재한다.(브라우저를 종료해도 유지)
- 키/값 쌍으로 데이터가 이루어져 있다.
- 용량의 제한이 있다.
Local Storage의 장단점
장점
저장된 데이터는 서버로 전송되지 않아 트래픽이 줄어든다.
단점
HTML5 미만의 브라우저에서는 지원이 되지 않는다.
Session Storage란?
HTML5에서 포함된 WebStorage 스펙중 하나로 웹 사이트의 데이터를 클라이언트에 저장할 수 있는 방식이다. 세션을 종료(브라우저를 닫음)할 경우 데이터는 삭제된다.
주로 비 로그인 -> 장바구니와 같은 경우에 사용된다.
Session Storage의 특징
- Session Storage는 세션을 종료할 경우 데이터가 삭제된다.
- 키/값 쌍으로 데이터가 이루어져 있다.
- 용량의 제한이 없다.
Session Storage의 장단점
Session Storage와 동일하며, 데이터 삭제 유무에 따른 기능 차이만 존재한다.
개발자 지망생