[FE/Web] 로컬스토리지, 세션스토리지, 쿠키

웹브라우저의 캐시

=> 쿠키, 로컬 스토리지, 세션 스토리지가 있따.
=> 이러한 것들은 보통 유저의 개인정보, 인증 모듈 관련사항들을 웹브라우저에 저장해서 추후 서버에 요청할 때 자신을 나타내는 아이덴티티나 중복 요청방지를 위해 쓰임.

쿠키

• 컴퓨터에 저장되는 텍스트 파일이다.
• 만료기한이 있는 키-값 저장소
  => 그 만료기한은 보통 서버에서 정한다고 한다. (클라이언트도 정할 수 있긴함)
• 하나의 쿠키는 4KB까지 저장가능.

로컬 스토리지

만료기한이 없는 키-값 저장소

• 브라우저을 닫아도 유지
• 도메인 단위로 생성한다.
• 클라이언트에서만 수정 가능하다
• 10MB까지 저장 가능

세션 스토리지

• 탭 단위로 세션 스토리지를 생성한다.
• 탭을 닫으면 데이터 삭제됨
• 클라이언트에서만 수정 가능
• 5MB까지 저장 가능

각 프로세스

쿠키

1. 클라이언트 요청 및 서버에서 쿠키 생성
2. HTTP 헤더에 쿠키를 포함시켜 전송
3. 브라우저가 받은 쿠키를 보관
4. HTTP 헤더에 쿠키 실어서 서버에 전달.

세션

1. 클라이언트 최초 접속시, 서버에서 세션 ID 발급
2. 쿠키를 이용하여 세션 ID를 클라이언트로 전송
3. 재접속시, 쿠키에 저장된 세션 ID를 서버에 전달
4. 서버는 요청 Header 에있는 쿠키 정보(세션 ID)로 클라이언트를 판별

세션과 쿠키의 차이

1. 가장 큰 차이는 저장소의 위치.

쿠키 - 브라우저에 저장
세션 - 웹 서버 내부 컨테이너에 저장

2. 생명주기
   쿠키는 유효기간에 따라 브라우저가 종료되어도 파일로 남는다.
   세션은 브라우저 탭 종료시 삭제된다.

쿠키, 세션, 캐시, 토큰

쿠키 - 클라이언트측에 저장되는 파일
세션 - 웹 서버에 저장되는 고유 저장소
캐시 - 웹 애플리케이션 성능 개선을 위한 플래시 메모리
토큰 - 인가된 정보에 대한 사인정보