쿠키.세션.로컬스토리지TIL(2021.10.09)

김도형 (르베니아)·2021년 10월 9일
0

TIL

목록 보기
11/38

쿠키! 세션! 로컬스토리지어떤걸 써야할까...

쿠키

클라이언트 로컬에 저장되는 키와 값이 들어있는 작은 데이터 파일.
사용자 인증 유요한 시간을 명시가능
시간이 정해진다면 브라우저가 종료되어도 인증이 유지!
클라이언트의 상태 정보를 로컬에 저장 참조
클라이언트에 300개까지 쿠키 저장가능, 하나의 도메인당 20개의 값만 가질 수 있다.
Response Header에 set-Cookie 속성을 사용하면 클라이언트에서 쿠키를 만들 수 있다.
사용자가 따로 요청하지 않아도 Request시 헤더에 넣어서 자동으로 서버에 전송

동작 방식

  1. 클라이언트가 페이지 요청
  2. 서버에서 쿠키 생성
  3. HTTP 헤더에 쿠키를 포함 응답
  4. 쿠키 만료시간이 있따면 클라이언트에서 따로 보관
  5. 서버에서 쿠키를 읽고 이전 상태 정보를 변경 할 필요가 있는 경우 쿠키를 업데이트 하여
    변경된 쿠키를 HTTP 헤더에 포함시켜 응답

세션

쿠키와는 다르게 세션은 서버쪽에서 관리한다.
서버에서 클라이언트를 구분하기 위해 ID를 부여 웹 브라우저가 서버에 접속 브라우저를 종료할때까지 인증상태 유지
세션도 만료시간을 설정가능..
쿠키와 다르게 보안이 좋음 하지만 사용자가 많아질경우 서버쪽 메모리를 많이 사용하게 된다.
클라이언트가 Request를 보내면 해당 서버가 클리언트에 유일한 ID를 부여 (세션 ID)

동작 방식

  1. 클라이언트가 서버에 접속 시 세션 ID를 발급
  2. 클리언트는 세션 ID에 대해 쿠키를 사용해서 저장
  3. 클리언트는 서버에 요청 할때 쿠키안의 세션 ID를 전달하여 사용
  4. 서버는 세션 ID를 전달받고 세션 ID로 세션에 있는 클라이언트 정보를 가져온다.
  5. 클라이언트 정보를 가지고 서버요청을 처리 클라이언트에게 응답

로컬스토리지

쿠키의 단점을 보안한것이 로컬스토리지
쿠키와 달리 HTTP요청에서 데이터를 주고 받을 필요가 없음
로컬 스토리지를 이용 클라이언트와 서버간의 전체 트래픽 낭비되는 대역폭의 양을 줄인다.
데이터가 유저의 로컬에 저장된다
로컬스토리지의 만료 조건은 쿠키와 비슷하다

자 그래서 뭐사용 할꺼임?

로그인 --> 로컬 스토리지
사용자의 중요한 정보 --> 세션
비 로그인 정보 --> 로컬 스토리지
중요하지 않은 정보 --> 쿠키

profile
한다. 간다. 해낸다.

0개의 댓글