sessionstorage 不能持久化。它是会话级存储,仅在当前标签页有效,关闭即清空,不写入磁盘、不跨标签页共享,专为临时状态设计,使用时需 json 序列化对象且须检测浏览器支持。

sessionStorage 能不能持久化?
不能。sessionStorage 是会话级存储,关掉当前标签页就清空,重启浏览器、换标签页、甚至刷新页面都不会让它“消失”,但只要那个标签页关闭,数据立刻没了——它不写入磁盘,也不跨会话延续。
- 不是浏览器 bug,是设计如此:它的存在就是为了临时状态兜底,比如多步表单中途刷新不丢数据
- 和 localStorage 最根本的区别就在这儿:一个靠“标签页生命周期”活,一个靠“用户手动清理”活
- 别指望它在 PWA 离线场景下扛住重启——那得用 localStorage 或 IndexedDB
怎么安全地存对象或数组到 sessionStorage?
必须先转成字符串,因为 sessionStorage.setItem() 只接受 string 类型的 value;直接传对象会变成 "[object Object]",读出来就废了。
- 存的时候用
JSON.stringify():sessionStorage.setItem('cart', JSON.stringify([{id: 1, qty: 2}])) - 取的时候先判空再
JSON.parse():const cart = sessionStorage.getItem('cart') ? JSON.parse(sessionStorage.getItem('cart')) : [] - 如果值是
null或非法 JSON(比如之前被篡改过),JSON.parse()会直接抛错,所以别省这个判断
为什么新开标签页读不到同一个域名下的 sessionStorage?
因为 sessionStorage 的作用域是“标签页 + 协议 + 域名 + 端口”,哪怕 URL 完全一样,两个标签页的 sessionStorage 也是完全隔离的内存实例。
- 这不是 bug,是规范强制要求:避免意外共享敏感中间态(比如支付流程中的 token)
- 想跨页传数据?用
localStorage+ storage 事件监听,或者用postMessage手动通信 - 注意:即使同源 iframe,若 src 不同,它的 sessionStorage 也和父页独立
怎么检测浏览器是否支持 sessionStorage?
别假设它一定存在——老版本 UC、部分 WebView、禁用 JS 存储的隐私模式都会让 window.sessionStorage 为 undefined。
立即学习“前端免费学习笔记(深入)”;
- 检查写法必须是:
if (typeof window.sessionStorage !== 'undefined') - 只检查
window.sessionStorage是否为 null 不够,因为未定义时它是undefined,不是null - 不支持时别硬 fallback 到
localStorage,得看场景:如果是临时防刷新丢失,内存变量(如全局对象)反而更合适











