공부한거 정리하는 노트에요

[Auth] 쿠키, 세션 스토리지, 로컬 스토리지

by 구설구설

HTTP는 요청과 응답으로 구성된 하나의 연결 사이클이 끝나면, 연결이 끊어지는 무상태성(Stateless)을 가지고 있기 때문에, 서버는 클라이언트의 상태를 저장하지 않는다.

따라서 클라이언트의 상태를 저장하고 필요할 때마다 데이터를 꺼내서 서버에 전달할 방법으로 사용하는 것이 바로 쿠키, 세션 스토리지, 로컬 스토리지이다.

 

쿠키 (Cookie)

  • 클라이언트 측에서 저장하는 작은 텍스트 파일
  • 서버로부터 전송된 쿠키는 웹 브라우저에 저장되며, 이후 해당 웹 사이트를 방문할 때마다 쿠키는 서버로 전송된다.
  • 쿠키는 일반적으로 사용자 식별 토큰, 장바구니 등의 정보를 저장하는 데 사용한다.
    • 24년 하반기 인턴 - 사용자 식별 토큰을 쿠키에 저장하였다.
  • 쿠키는 유효 기간이 있으며, 브라우저는 유효 기간이 지난 쿠키를 삭제한다.
  • 쿠키는 한 도메인당 약 4KB의 데이터를 저장할 수 있기에 대용량의 데이터를 저장하는 데에는 적절하지 않다.

 

로컬 스토리지 (Local Storage)

  • 클라이언트에 데이터를 저장할 수 있다.
  • 브라우저를 종료하더라도 로컬 스토리지의 데이터는 유지된다.
    • 24년 하반기 인턴 - 24.08까지의 시각화 서비스는 다크모드, 라이트모드 상태를 로컬 스토리지를 통해 관리했었다.
  • 서버로 데이터가 자동으로 전달되지 않기에, 서버에 요청을 보낼 때 필요한 데이터를 추출하여 전달하는 로직이 필요하다.

 

세션 스토리지 (Session Storage)

  • 클라이언트에 데이터를 저장할 수 있다.
  • 브라우저 세션이 유지되는 동안에만 데이터가 유지된다.
  • 브라우저를 종료하면 세션 스토리지에 저장된 데이터는 모두 삭제된다.
  • 서버로 데이터가 자동으로 전달되지 않기에, 서버에 요청을 보낼 때 필요한 데이터를 추출하여 전달하는 로직이 필요하다.

블로그의 정보

공부중임

구설구설

활동하기