localStorage数据永久保存,sessionStorage仅限当前标签页会话;前者同源页面共享,后者完全隔离;均支持5MB容量、字符串存储及相同API,但不参与HTTP请求。

Web Storage API 提供了两种在浏览器端保存键值对数据的方式:localStorage 和 sessionStorage。它们看起来很像,用法一致,但关键差异直接影响数据能不能“活过”一次页面关闭、能不能在多个标签页间互通——选错可能让表单草稿莫名消失,或让主题设置在新窗口里失效。
生命周期:数据能活多久?
这是最根本的区别:
-
localStorage:数据长期存在,除非代码主动调用
removeItem或clear,或用户手动清除浏览器缓存。关掉浏览器、重启电脑、甚至隔几天再打开网站,数据还在。 - sessionStorage:数据只属于当前标签页(或窗口)的“会话”。刷新页面保留;关闭该标签页后,数据立刻清空。新开一个同域名的标签页,它的 sessionStorage 是全新的、空的。
作用域:哪些页面能读到这些数据?
两者都受同源策略限制(协议+域名+端口必须一致),但共享范围不同:
批量分析录音转写,输出多维度拓客报告。触发词:录音分析、总结、音频总结、拜访记录总结。当用户提及「分析录音」「看看录音数据」「最近的录音」「通话记录」且意图为批量统计/分析时触发。仅出现「录音」或「拜访」时需结合上下文,若仅查看单条详情则不触发。
-
localStorage:同源下所有标签页和窗口共享一份数据。比如你在 A 标签页存了
theme: "dark",B 标签页也能立即读到。 - sessionStorage:严格隔离。即使两个标签页打开的是同一个网址,它们的 sessionStorage 互不干扰,完全独立。
典型使用场景
根据生命周期和作用域,自然对应不同需求:
- localStorage适合存需要跨会话、跨标签页持续生效的信息:用户选择的主题、语言偏好、是否开启夜间模式、长期登录凭证(注意安全)、离线缓存的静态资源列表。
- sessionStorage适合存仅限当前浏览流程的临时状态:多步骤表单的中间填写内容、未提交的购物车快照、单页应用中当前路由的临时参数、一次性验证码或令牌(仅本标签页有效,更安全)。
共性与注意事项
它们共享很多基础特性:
- 都只支持字符串作为存储值;存对象需先
JSON.stringify,取时再JSON.parse。 - 容量相近,主流浏览器通常提供约 5MB/域名,远大于 Cookie 的 4KB。
- API 完全一致:
setItem、getItem、removeItem、clear。 - 数据不参与 HTTP 请求,不会随每个请求发往服务器,比 Cookie 更轻量、更隐私。
- 不建议存敏感信息(如密码、银行卡号),因为数据可被同源脚本直接读取。

















