23.09.08
1. 쿠키와 웹 스토리지 사용 배경
HTTP는 요청과 응답을 주고 받아 한 사이클이 종료되면 연결이 끊어지는 무상태성을 가지고 있기 때문에 클라이언트의 상태를 보존하지 않는다.
그리하여 클라이언트의 상태를 서버가 아닌 클라이언트에 저장해두고 필요시마다 데이터를 꺼내서 사용하는 방식으로 HTTP의 단점을 보완하고자 쿠키와 웹 스토리지가 사용되기 시작했다.
2. 쿠키(Cookie)
쿠키(Cookie) : 클라이언트(브라우저) 로컬에 저장되는 키-값 (pair)으로 이루어진 작은 데이터 파일을 의미
ex. 자동 로그인, 쇼핑몰의 장바구니, 접속 시간 체크같은 작업을 수행할 때 주로 사용
3. 세션(Session)
세션(Session) : 쿠키 기반이지만, 사용자 정보 파일을 브라우저에 저장하는 쿠키와 달리 서버에 저장하는 방법
ex. 로그인 같이 보안상 중요한 작업을 수행할 때 주로 사용
4. 웹 스토리지(Web Storage)
웹 스토리지(Web Storage) : 키-값 (pair) 형태로 데이터를 저장해서 key를 기준으로 조회할 수 있는 저장소
웹 스토리지에는 영구 저장소인 로컬 스토리지와 임시 저장소인 세션 스토리지 이렇게 2가지 타입이 있다.
로컬 스토리지와 세션 스토리지 모두 저장소이지만 약간의 차이가 있다.
차이는 아래에 적혀있다 !
5. 쿠키, 세션, 웹 스토리지의 차이점
=> 즉, 쿠키, 세션, 웹 스토리지는 모두 웹 브라우저에서 데이터를 저장하고 관리하기 위한 메커니즘이다. 그러나 각각의 특징과 사용 용도에 차이가 있다.
5-1. 쿠키
- 서버에서 생성하고 클라이언트의 상태 정보를 로컬에 저장하고 만료 기간을 설정할 수 있다.
- 주로 사용자 인증, 세션 관리, 사용자 기본 설정 등에 활용된다.
: 사용자 인증이 유효한 시간을 명시할 수 있으며, 유효 시간이 정해지면 브라우저가 종료되어도 인증이 유지된다. - 브라우저마다 저장 가능한 쿠키의 개수와 용량에 제한이 있다.
- 보안상 취약할 수 있으며, 민감한 정보를 저장하기에는 적절하지 않을 수 있다.
- 키는 사용자가 따로 요청하지 않아도 브라우저가 Request시에 Request Header를 넣어서 자동으로 서버에 전송하며 Set-Cookie 속성을 사용하면 클라이언트에 쿠키를 만들 수도 있다.
- 키나 값을 포함하여 쿠키의 다른 구성 요소에는 유효시간, 도메인 경로 등이 있다.
5-2. 세션
- 서버에 데이터를 저장하고 클라이언트는 세션 식별자를 쿠키 등으로 전달하여 식별하는 방식이다.
- 서버에서 생성되며, 일반적으로 브라우저가 종료되거나 세션 만료 시간이 지나면 삭제된다.
: 웹 브라우저가 서버에 접속해서 브라우저를 종료할 때까지 인증상태를 유지한다. - 세션 데이터의 저장 공간은 서버 측에서 관리되기 때문에 보안성이 더 높다.
- 세션 관리를 위해 서버 자원을 사용하기 때문에 서버 부하가 발생할 수 있어 사용자가 많아질수록 서버 메모리를 많이 차지하게 된다.
- 주로 사용자 인증 정보나 중요한 데이터를 저장하는 데 사용된다.
- 클라이언트가 Request를 보내면, 해당 서버의 엔진이 클라이언트에게 유일한 ID를 부여하는 데 이것이 세션 ID이다.
5-3. 웹 스토리지
- localStorage
- 브라우저를 종료하더라도 데이터가 유지되며, 사용자가 직접 지우지 않는 한 계속 남아있다.
- sessionStorage
- 브라우저 세션 동안 데이터가 유지되며, 브라우저를 닫으면 데이터가 삭제된다.
- 주로 클라이언트 측에서 임시 데이터 저장, 캐시 사용, 오프라인 작업 등에 활용된다.
- 보안성이 상대적으로 낮을 수 있으며, 브라우저마다 저장 가능한 데이터 용량에 제한이 있을 수 있다.
6. 레퍼런스
쿠키, 세션, 웹 스토리지 차이 (cookie, session, web storage)
쿠키와 세션 그리고 로컬 스토리지와 세션 스토리지
웹 스토리지 vs 쿠키 vs 세션
