🍪[Stateful HTTP를 위해] 쿠키와 세션, 캐시, local/Session Storage

쿠키

HTTP는 무상태, 단기간연결 프로토콜이라 각 요청에 대해 동일한 사용자가 보낸 요청인지 판단이 어렵다. 상태를 유지하고 연속응답을 해 동일한 사용자 접속 세션인지 인식할 수 있도록 쿠키를 사용된다.

네이버에 처음 접속했을 때, 첫 응답 메시지에 'Set-Cookie'를 확인할 수 있다. 쿠키엔 보안문제를 대비해 Expires 유효기간과 쿠키가 전송되는 사이트에 대한 제한 사항이 있다.

이 쿠키를 클라이언트 브라우저에 문자형태로 저장하게 되고 앞으로의 클라이언트의 요청엔 쿠키가 헤더에 담겨 전송된다. 이 쿠키로 서버는 사용자를 구분하게 된다.

주로 공개되어도 괜찮은 정보만 담는다. 보안이 중요한 정보는 클라이언트 쿠키에 저장하지 않고 서버의 세션을 활용한다. 오로지 세션ID 등 식별 정보만 클라이언트에 저장하고 필요한 정보는 서버에 요청하여 사용하도록 한다.

유효기간에 따른 쿠키 종류

• 세션쿠키: 브라우저를 식별하는 용도, 연결되어있는 동안만 유효하다.
  브라우저를 종료하면 쿠키도 삭제된다.
• permanent쿠키: 쿠키의 유효시간이 있어 해당기간동안 유지된다. 브라우저를 종료해도 유효기간동안 유지된다. (예시 - 장바구니, 로그인 상태 기억, 사이트 내 맞춤형 광고 a.k.a.)

깃 오오스로 로그인한 프로젝트가 생각나는데,
잘 모를땐 한번 로그인해서 아이디나 이메일 주소 등을 로컬스토리지에 저장하고 썼는데
마지막 이슈트래커 프로젝트때엔 JWT토큰만 로컬에 저장하고 필요시 서버에 사용자 정보를 요청하여 사용했다. 그리고 이 토큰의 유효기간이 지나면 로그아웃 처리되도록 구현했었는데 쿠키의 방식과 동일한 것 같다.

세션

서버는 브라우저에서 요청이 들어오면 쿠키값을 먼저 확인하는데, 쿠키값이 없다면 해당 요청에 대해 새로운 세션을 만들고, 서버에 저장한다. 이 세션을 응답헤더에 담아 브라우저가 쿠키를 저장하게 된다. 응답헤더에는 세션자체보다 세션ID와 같은 식별정보만 보낸다.

내장객체(key: value)형태이고 세션 ID도 생성된다. 생성된 세션은 setAttribute(), getAttribute()를 이용해 값을 저장하고 사용할 수 있다.

이 세션 객체는 클라이언트에 보관하기에 보안위험이 있는 중요한 정보들을 저장하기에 용이하다. 웹 브라우저가 종료되거나 서버에서 session.invalidate()시 세션 객체가 제거된다.

캐시

브라우저 성능에 관여한다.
여러번 요청될 법한 내용들은 서버-클라이언트 간 임시저장소, 캐시에 보관해둔다.
반복된 요청을 하지 않아 속도를 높이고 비용을 줄이게 된다.

localStorage & sessionStorage

둘의 차이점은 영구성이다.
로컬스토리지는 브라우저를 종료해도 저장 내용이 남아있어 지속적으로 필요한 데이터를 저장하고,세션스토리지는 브라우저 종료 시 저장 내용이 삭제되기 때문에 잠시만 사용할 내용을 저장한다.