JavaScript本地存储有Cookie、localStorage、sessionStorage三种：Cookie自动随请求发送、容量小、适合身份标识；localStorage永久存储、5MB、同源共享；sessionStorage仅限单标签页、关闭即清空。
JavaScript 的本地存储主要有三种方案：Cookie、localStorage 和 sessionStorage。它们都运行在浏览器端，受同源策略限制，但设计目标、生命周期、容量和传输行为差异明显。选哪个，关键看你要存什么、存多久、是否需要发给服务器。
Cookie：带“邮差”的小纸条
Cookie 是最老的本地存储机制，本质是 HTTP 协议的一部分。每次同源请求（包括图片、脚本等）都会自动携带 Cookie，所以它天然适合做身份标识（比如 sessionid）。但它有硬性限制：
单个 Cookie 最大 4KB，总数量和大小也受限（各浏览器不同） 必须手动设置 Expires 或 Max-Age 才能持久；不设则为会话级（关浏览器即失效） 支持 Path 和 Domain 属性，可控制作用范围 有 HttpOnly 和 Secure 标志，增强安全性（防 XSS 窃取）
适合场景：用户登录凭证、跨页面/跨请求的身份识别、轻量级追踪标记。
localStorage：关机也不丢的“抽屉”
localStorage 是 Web Storage API 的一部分，数据永久保存在本地，除非手动清除（调用 clear() 或 removeItem()），关浏览器、重启电脑都不影响。
立即学习“Java免费学习笔记（深入）”；
容量约 5MB（Chrome/Firefox），远大于 Cookie 只在同源（协议+域名+端口）的所有标签页、窗口间共享 不会随 HTTP 请求自动发送，纯前端使用 只支持字符串值，存对象需 JSON.stringify()，读取时要 JSON.parse() 修改时会触发其他同源窗口的 storage 事件（可用于跨标签页通信）
适合场景：用户主题偏好、语言设置、离线缓存、学习进度、长期配置项。
sessionStorage：仅限当前标签页的“便签”
sessionStorage 和 localStorage 接口完全一致，但作用域更窄、生命周期更短：数据只属于当前浏览器标签页（或窗口），关闭该标签页即清空，刷新页面不丢失。
同样约 5MB 容量，同源限制，不自动发请求 同一网址打开两个标签页，它们的 sessionStorage 互不可见 适合临时暂存、不希望跨页干扰的数据
适合场景：多步骤表单的中间状态、页面跳转时传递少量参数、临时筛选条件、未提交的草稿。
三者核心区别速查
· 生效范围：Cookie 和 localStorage 全局同源共享；sessionStorage 每个标签页独立。
· 存活时间：Cookie 可设过期时间；localStorage 永久；sessionStorage 仅到标签页关闭。
· 网络传输：Cookie 自动参与每次请求；另两者完全不发送。
· 容量上限：Cookie ≤4KB；localStorage/sessionStorage ≈5MB。
· 安全注意：敏感信息（如 token）不要存在 localStorage（易被 XSS 读取）；优先用 HttpOnly Cookie 或内存变量 + 定期刷新机制。
以上就是javascript的本地存储有哪些方案_localStorage和sessionStorage有何区别的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1544042.html
微信扫一扫 
支付宝扫一扫 
