Frontend hay gặpCả ba lưu dữ liệu ở client nhưng khác nhau rõ:
| Cookie | localStorage | sessionStorage | |
|---|---|---|---|
| Dung lượng | ~4KB | ~5–10MB | ~5–10MB |
| Gửi kèm request | Có (mỗi HTTP request) | Không | Không |
| Vòng đời | theo Expires/Max-Age | tới khi bị xóa | hết khi đóng tab |
| Phạm vi | theo domain/path | theo origin | theo origin + tab |
| API JS đọc được | trừ khi HttpOnly | có | có |
Chọn:
- Cookie cho dữ liệu server cần mỗi request (phiên đăng nhập) — đặt HttpOnly, Secure, SameSite.
- localStorage cho dữ liệu client bền, không nhạy cảm (theme, cấu hình UI).
- sessionStorage cho state tạm theo tab (bước wizard, form nháp).
Cả hai Web Storage đều đồng bộ + chỉ chuỗi (phải JSON.stringify), và không nên lưu token nhạy cảm vì JS/XSS đọc được.