如何用 window.name 跨域存储不敏感的临时业务数据

window.name适合存临时业务数据，因其生命周期与窗口绑定、跨域可用、不参与HTTP请求；但仅支持字符串、有容量限制且同域iframe共享，故适用于非敏感、临时、结构简单的数据。为什么 window.name 适合存临时业务数据window.name 是浏览器原生支持的全局属性，生命周期与窗口（tab）绑定，只要不关闭或导航到新页面（或调用 window.location.assign 等完全替换当前文档），它的值就一直保留。它不参与 HTTP 请求，不受同源策略限制------也就是说，A 域名页面可以设置 window.name = "data=123"，然后跳转到 B 域名页面，B 页面仍能读取该字符串。但它只支持字符串，最大容量约 2MB（不同浏览器略有差异），且所有同域内 iframe 共享同一个 window.name（注意：是同窗口下所有 iframe 的 window.name 都指向顶层窗口的 name，不是各自独立）。所以它只适合存「不敏感、临时、结构简单」的数据，比如登录态跳转时的 token 片段、表单草稿 ID、来源页标记等。怎么安全地序列化和解析 window.name 数据直接赋值原始 JSON 字符串风险高：如果数据含特殊字符（如换行、双引号、
）可能破坏后续 JSON.parse；更糟的是，若数据来自不可信输入，还可能引入执行逻辑（虽然 window.name 不会自动执行 JS，但误解析可能引发异常或逻辑错乱）。推荐统一走「编码 + 解码」流程：设置前用 encodeURIComponent 编码整个 JSON 字符串 读取后先 decodeURIComponent，再 JSON.parse 加 try/catch 包裹解析过程，失败则清空并返回默认值 // 存window.name = encodeURIComponent(JSON.stringify({ orderId: "ORD-789", step: 2 }));<p>// 取let data = {};try {const raw = decodeURIComponent(window.name);data = JSON.parse(raw);} catch (e) {window.name = ""; // 清理脏数据，避免下次继续报错}</p>不要用 escape 或正则替换，前者已废弃，后者易漏边界情况。跨域跳转时 window.name 会被意外覆盖的几种情况window.name 不是"跨域专用通道"，它只是恰好跨域可用。很多前端框架或 SDK 会在初始化时悄悄改写它（比如某些老版本的 jQuery 插件、埋点 SDK、甚至部分 UI 组件库的 iframe 封装逻辑）。 Mokker AI AI产品图添加背景