캐시, 쿠키, 세션, 로컬스토리지

캐시

• 목적 : 웹 페이지의 로딩 시간을 줄이고 효율적인 데이터 처리를 위해 자주 사용되는 데이터를 임시로 저장
• 웹 사이트의 리소스(이미지, 스타일 시트, 자바스크립트 파일 등)를 로컬에 저장하고 동일 리소스에 대한 재요청이 있을 때 서버로부터 불러오는 대신 로컬에 저장된 데이터 사용
• 브라우저에 할당된 로컬 저장공간에 리소스 저장

쿠키

• 목적 : 사용자의 세션 관리(로그인 상태 등), 개인화(사용자 설정 및 환경 설정), 트래킹(사용자 행동 추적) 등에 사용
• 작은 데이터 조각을 사용자의 브라우저(로컬)에 저장, 웹 서버가 사용자의 브라우저를 식별할 수 있도록 함, 서버/클라이언트 간의 요청/응답 헤더를 통해 전송
• 제한 사항 : 용량 제한(약 4KB), 만료 기간 존재, 도메인 및 경로에 의한 접근 제한
• 헤더 예시 : Set-Cookie: session_id=abc123; Expires=Wed, 09 Jun 2021 10:18:14 GMT(2021년 6월 9일 10시 18분 14초에 만료되는 세션 id가 abc123이라는 쿠키), 이후 사용자가 동일한 서버에 요청을 보낼 때 브라우저는 자동으로 쿠키 정보를 요청 헤더에 포함하여 서버에 전송(Cookie: session_id=abc123)

세션

• 목적 : 사용자 별로 서버에 정보를 저장, 사용자가 웹 사이트를 탐색할 때 지속적인 상태 유지
• 각 사용자에게 고유한 세션 ID가 할당, 이 ID를 통해 사용자의 상태를 서버 측에서 관리, 쿠키보다 보안이 강화
• 사용 사례 : 로그인 상태 유지, 쇼핑 카트의 항목 관리 등
• 세션의 서버 저장 과정 : 사용자가 웹 사이트에 로그인 할 때, 서버는 사용자에 대한 세션을 생성, 고유한 세션 ID 할당, 이후 사용자가 웹 사이트를 탐색할 때, 브라우저는 세션 ID를 포함한 쿠키를 서버에 전송, 서버에서 id 조회 후 해당 세션에 맞는 컨텐츠나 서비스 제공

로컬 스토리지

• 목적 : 웹 애플리케이션에서 사용자의 브라우저에 데이터를 영구적으로 저장하기 위해 사용
• 사용자의 브라우저의 대량의 데이터(최대 5MB 이상)를 저장할 수 있음, 만료 기간 없음, 웹 페이지 세션 간에도 데이터가 유지
• 사용 사례 : 사용자의 언어 설정, 테마 설정 등의 사용자 인터페이스 설정 정보 저장