现代Web开发应优先使用localStorage或sessionStorage而非document.cookie，因其更安全、容量更大、API更简洁；Cookie因每次请求自动携带、手动解析复杂、无作用域隔离及安全限制而被弱化；二者均仅支持字符串，localStorage持久同源共享，sessionStorage仅限当前标签页；Storage API提供setItem、getItem等同步方法，存取对象需JSON序列化；仅当需服务端协同（如HttpOnly登录态、跨子域认证）时才用Cookie。
直接操作 Cookie 已不推荐，现代 Web 开发更倾向用 localStorage 或 sessionStorage 存储客户端数据；它们更安全、容量更大、API 更简洁。
为什么少用 document.cookie？
Cookie 是为服务端设计的，每次 HTTP 请求都会自动携带，增加带宽开销；手动解析和设置字符串麻烦且易出错；默认无作用域隔离，容易被覆盖；还涉及安全标记（如 HttpOnly、Secure）限制前端访问。
- 写入需拼接字符串：
document.cookie = "name=value; expires=...; path=/; secure" - 读取需手动拆分、解码：没有原生方法获取单个 Cookie 值
- 大小限制约 4KB，且包含在每个请求头中
localStorage 和 sessionStorage 的区别
两者都提供键值对存储，仅支持字符串，但生命周期和作用域不同：
- localStorage：持久保存，关闭浏览器也不丢失，同源页面共享
- sessionStorage：仅当前标签页有效，关闭标签即清空，即使同源其他标签页也无法访问
怎么用 Storage API（简单又可靠）
所有方法都是同步的，无需 await，直接调用即可：
立即学习“Java免费学习笔记（深入）”；
- 存数据：
localStorage.setItem('theme', 'dark') - 取数据：
const theme = localStorage.getItem('theme')（返回字符串或 null） - 删单个：
localStorage.removeItem('theme') - 清空全部：
localStorage.clear() - 检查是否存在：
if (localStorage.getItem('token')) { ... }
注意：不能直接存对象或数组，需先 JSON.stringify()；读取后用 JSON.parse() 还原。
什么场景仍要用 Cookie？
仅当需要与服务端协同时才保留 Cookie，例如：
- 用户登录态（配合
HttpOnly + Secure + SameSite防 XSS 和 CSRF） - 跨子域身份识别（如 login.example.com 和 app.example.com 共享）
- 服务端渲染（SSR）首次请求需读取认证信息
前端只需关注业务逻辑，认证类 Cookie 应由后端设置并保护，前端避免直接读写敏感字段。
