브라우저의 웹 스토리지(Web Storage)와 쿠키와의 차이
브라우저의 웹 스토리지(Web Storage)와 쿠키
웹 스토리지와 쿠키는 웹 애플리케이션에서 클라이언트 측에 데이터를 저장하기 위한 방법입니다. 각각의 기능과 특징을 살펴보겠습니다.
웹 스토리지 (Web Storage)
- 종류: Local Storage, Session Storage 두 가지가 있습니다.
- 용량: 일반적으로 5MB~10MB 정도의 데이터를 저장할 수 있습니다.
- 수명: Local Storage는 수명이 무제한이고, Session Storage는 브라우저 세션이 종료될 때까지입니다.
- 접근성: 같은 도메인 내에서만 접근이 가능합니다.
- HTTP 헤더: 웹 스토리지는 HTTP 헤더와 상호작용하지 않습니다.
쿠키 (Cookie)
- 용량: 작은 데이터 (약 4KB)만 저장 가능합니다.
- 수명: 설정 가능한 만료 시간이 있습니다.
- 접근성: 도메인과 경로에 따라 접근이 제한될 수 있습니다.
- HTTP 헤더: 서버와 클라이언트 간에 HTTP 헤더를 통해 전송됩니다.
- 보안: HttpOnly, Secure 등의 플래그를 사용하여 보안을 강화할 수 있습니다.
주의사항
- 보안: 웹 스토리지는 클라이언트 측에서 쉽게 조작될 수 있으므로 민감한 정보를 저장하는 데에는 적합하지 않습니다. 쿠키의 경우 HttpOnly 플래그를 사용해 자바스크립트에서의 접근을 제한할 수 있습니다.
사용 케이스
- 웹 스토리지: 사용자 설정, 장바구니 정보 등을 저장할 때 사용
- 쿠키: 사용자 인증, 세션 관리 등에 주로 사용
웹 스토리지와 쿠키는 각각의 장단점과 사용 케이스가 있으므로 상황에 맞게 적절히 사용해야 합니다.
웹 스토리지(Web Storage)와 쿠키의 차이점
웹 스토리지와 쿠키는 모두 웹에서 데이터를 저장하기 위한 수단이지만 여러 가지 차이점이 있습니다.
용량
- 웹 스토리지: 일반적으로 5MB~10MB 정도의 데이터를 저장할 수 있습니다.
- 쿠키: 약 4KB의 작은 데이터만 저장 가능합니다.
수명
- 웹 스토리지: Local Storage는 무제한, Session Storage는 브라우저 세션이 끝날 때까지 저장됩니다.
- 쿠키: 만료일을 설정할 수 있으며, 만료일이 지나면 자동으로 삭제됩니다.
서버와의 상호작용
- 웹 스토리지: HTTP 헤더와 상호작용하지 않으므로 서버로 전송되지 않습니다.
- 쿠키: HTTP 헤더를 통해 서버와 데이터를 주고받습니다.
보안
- 웹 스토리지: 클라이언트 측에서 쉽게 접근 및 수정이 가능하므로 보안에 취약합니다.
- 쿠키: HttpOnly, Secure 등의 옵션을 사용하여 보안을 강화할 수 있습니다.
도메인과 경로
- 웹 스토리지: 같은 도메인에서만 데이터를 읽을 수 있습니다.
- 쿠키: 도메인과 경로 설정을 통해 어디에서 쿠키를 사용할 것인지 제어할 수 있습니다.
사용 케이스
- 웹 스토리지: 사용자 설정, 장바구니, UI 상태 정보 등을 저장
- 쿠키: 세션 관리, 사용자 인증, 개인화 등에 사용
각 기술은 자신의 장단점과 적용 상황이 다르므로, 필요에 따라 적절한 저장 수단을 선택해야 합니다.
'[F-Lab 멘토링 학습]' 카테고리의 다른 글
| 성능 최적화를 위해 어떤 방법과 도구를 사용하나요? (0) | 2023.10.24 |
|---|---|
| XSS(Cross-Site Scripting), CSRF(Cross-Site Request Forgery)와 방어법 (1) | 2023.10.24 |
| 테스팅툴 Selenium의 컴포턴트와 기능 (1) | 2023.10.24 |
| 테스팅시 사용되는 Mock과 Mock Framework (0) | 2023.10.24 |
| 데이터베이스의 샤딩(Sharding)의 작동방식과 장단점 (0) | 2023.10.21 |