JavaScript本地存储分Cookie、localStorage、sessionStorage：Cookie用于服务端共享小数据并支持安全策略；localStorage持久保存前端字符串数据；sessionStorage仅限当前标签页临时存储。
JavaScript 操作浏览器本地存储主要靠 Cookie、localStorage 和 sessionStorage 三种机制。它们用途不同、容量不同、生命周期也不同，选对才能避免踩坑。
Cookie：适合传给服务器的小数据
Cookie 是最早期的本地存储方式，特点是每次 HTTP 请求都会自动携带（除非设为 HttpOnly），所以它本质是“客户端与服务端共享的状态”。
大小限制严格：单个 Cookie 通常 ≤4KB，一个域名下总 Cookie 数量和大小都有浏览器限制 需要手动操作：没有原生 API，得自己封装 document.cookie 的读写逻辑（注意分号和等号格式） 支持过期时间、作用域（path / domain）、安全标记（Secure / HttpOnly / SameSite） 典型用途：用户登录态（如 session ID）、CSRF token、A/B 实验分组标识
localStorage：持久保存前端状态
localStorage 是纯前端的键值对存储，数据永久保留在浏览器中（除非手动清除或用户主动删除），且不随请求发送到服务器。
容量大：一般 5–10MB（各浏览器不同），远超 Cookie 操作简单：localStorage.setItem('key', 'value')、localStorage.getItem('key')、removeItem、clear 只支持字符串：存对象要先 JSON.stringify()，取出来要 JSON.parse() 同源限制严格：协议 + 域名 + 端口完全一致才可访问 典型用途：用户偏好设置（主题、语言）、表单草稿、离线缓存的静态资源元信息
sessionStorage：页面会话级临时存储
行为和 localStorage 几乎一样，但生命周期仅限当前标签页（或窗口）——关闭标签即清空，新开标签也不共享。
立即学习“Java免费学习笔记（深入）”；
适合临时中转数据：比如从列表页跳转详情页时传参，避免 URL 暴露敏感内容 多标签隔离：每个标签页有独立的 sessionStorage，互不影响 刷新页面不丢失，关掉再开就没了
Cookie 还是 localStorage？关键看这三点
不用死记硬背，按实际需求判断：
要不要发给后端？ 要 → 用 Cookie；不要 → 优先 localStorage 或 sessionStorage 数据是否敏感？ 是登录凭证、token 等 → Cookie 配合 HttpOnly + Secure + SameSite=Strict 更安全；纯前端状态（如折叠菜单）→ localStorage 更合适 要存多久？ 长期有效（如记住用户名）→ localStorage；本次会话即可 → sessionStorage；需服务端控制过期 → Cookie
基本上就这些。不复杂但容易忽略细节，比如忘记 JSON 序列化、混淆同源规则、或者把敏感 token 明文塞进 localStorage —— 后者其实已被不少 XSS 攻击利用过。
以上就是javascript如何操作浏览器本地存储？_javascript中Cookie和LocalStorage怎么选择？的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1542754.html
微信扫一扫 
支付宝扫一扫 
