browser
브라우저 Storage.
Cookie, localStorage, sessionStorage, IndexedDB 용도와 제한, 보안
브라우저는 Cookie, Web Storage, IndexedDB 등 계층별 저장소를 제공하며, 용량, 수명, API, 서버 전송 여부가 다릅니다.
⚖️ 비교
| Cookie | sessionStorage | localStorage | IndexedDB | |
|---|---|---|---|---|
| 용량 | ~4KB | ~5MB | ~5MB | 훨씬 큼 |
| 수명 | Expires/Max-Age | 탭 종료 | 영구(도메인) | 영구 |
| 서버 전송 | 매 요청 | X | X | X |
| API | string | sync KV | sync KV | async DB |
- 토큰: HttpOnly Cookie 권장 (XSS 완화). localStorage는 JS 접근 가능.
- UI 설정, draft: localStorage (민감 X)
- 탭별 임시 state: sessionStorage
- 오프라인 캐시, 대용량: IndexedDB + Service Worker
- Recoil persist 등은 localStorage 래퍼
🔗 참고 자료
- Web Storage API (MDN) — localStorage, sessionStorage의 용도와 동기 API 특성을 설명한다.
- HTTP cookies (MDN) — Cookie 속성, 보안(HttpOnly, Secure, SameSite)을 정리한다.
- IndexedDB API (MDN) — 대용량 구조화 데이터의 비동기 클라이언트 DB를 다룬다.
- Browser storage quotas and eviction criteria (MDN) — 저장 용량 한도와 축출 기준을 설명한다.
