sessionStorage用于管理当前标签页的会话级临时数据,关闭即清空、不跨标签共享、仅支持字符串存储;需用JSON.stringify/parse处理对象,注意作用域限制及安全边界。

JavaScript 中通过 window.sessionStorage 管理会话级临时数据,它在当前浏览器标签页(或窗口)生命周期内有效,关闭标签即清空,不跨标签共享,也不持久化到磁盘。
sessionStorage 的基本操作方式
它提供类似 Map 的键值对存取接口,所有值都会自动转为字符串存储:
-
存数据:用
setItem(key, value),例如sessionStorage.setItem('user', 'Alice') -
读数据:用
getItem(key),例如sessionStorage.getItem('user')返回"Alice" -
删单个:用
removeItem(key),例如sessionStorage.removeItem('user') -
全清空:用
clear(),整个会话存储立即变空
注意数据类型和 JSON 序列化
sessionStorage 只支持字符串值。若存对象、数组或布尔值,需手动序列化与解析:
- 存对象:
sessionStorage.setItem('cart', JSON.stringify({id: 1, qty: 2})) - 取对象:
JSON.parse(sessionStorage.getItem('cart')),建议加 try-catch 防止解析失败 - 直接存
true或null会被转成字符串"true"和"null",取出来不是原始类型
作用域限制与常见误区
sessionStorage 不是“用户会话”,而是“页面会话”:
立即学习“Java免费学习笔记(深入)”;
- 同一域名下,新开一个标签页(即使 URL 完全相同),sessionStorage 是独立的,互不读写
- 页面刷新、前进后退、history.pushState 跳转,sessionStorage 数据保持不变
- iframe 子页面若同源,可访问父页面的 sessionStorage;但跨域 iframe 无法访问,会报安全错误
- 无痕/隐私模式下仍可用,但关闭窗口后自动清除
实用小技巧
可以封装简单工具提升健壮性:
- 写一个
safeSet(key, value)函数,内部用JSON.stringify+ try-catch,失败时降级为字符串 - 读取时用
safeGet(key, defaultValue),自动处理 null / undefined / 解析异常 - 监听
storage事件(仅在其他同源标签页修改 sessionStorage 时触发),可用于多标签状态同步(如登出广播)


















