storage partitioning是浏览器默认启用的安全机制,将第三方iframe的存储(如localstorage)隔离到“主站+第三方”双origin分区中,html无法控制;它由浏览器根据加载上下文自动实施,开发者只能适配而非关闭。

HTML 本身不提供 Storage Partitioning(存储分区隔离)能力——这是浏览器底层机制,由 document.domain、origin 和第三方上下文共同决定的,不是靠写 HTML 标签就能开启或关闭的。
Storage Partitioning 是什么,为什么你改不了 HTML 就生效
Storage Partitioning 是现代浏览器(Chrome 89+、Edge 105+、Safari 15.4+)默认启用的安全策略:当一个页面通过 iframe 加载第三方域名资源时,该第三方脚本读写的 localStorage、sessionStorage、Cache API、IndexedDB 等会被自动隔离到以「主站 origin + 第三方 origin」为键的独立分区中。也就是说,https://a.com 嵌入的 https://b.com/widget.js,其 localStorage.setItem('x', '1') 实际存的是 https://a.com ➝ https://b.com 分区下的数据,和直接访问 https://b.com 时的 localStorage 完全不共享。
这个行为不由 HTML 控制,也不受 <meta> 或 <script></script> 写法影响;它是基于网络请求的 Sec-Fetch-Site 头和加载上下文动态判断的。
iframe 中的第三方脚本为何突然读不到 localStorage
典型现象:你在一个 iframe 里加载了广告或统计 SDK(比如某 analytics.js),它以前能正常读写 localStorage,升级 Chrome 后发现 localStorage.getItem('token') 总是 null。
- 这不是 bug,是 Storage Partitioning 生效了——它现在访问的是分区版 storage,而旧数据还在非分区(legacy)位置
- 调用
localStorage.length返回 0 不代表没数据,只代表当前分区为空 -
localStorage.key(0)、localStorage.clear()都只作用于当前分区,不会清理其他 origin 下的历史数据 - 无法通过 HTML 属性(如
sandbox、referrerpolicy)绕过或禁用该隔离
如何检测当前环境是否启用了 Storage Partitioning
没有标准 API 直接返回布尔值,但可通过行为试探:
const testKey = '__storage_partition_test_' + Date.now();
localStorage.setItem(testKey, 'test');
const exists = localStorage.getItem(testKey) !== null;
localStorage.removeItem(testKey);
// 如果在第三方 iframe 中执行,exists 为 true 表示仍可写(可能未分区或已降级)
// 但更可靠的方式是检查 origin 关系:
if (self.origin !== top.origin && document.cookie === '') {
// 很可能处于 partitioned 上下文(尤其配合 cookie 的 SameSite=Lax/Strict)
}
注意:document.cookie 在 partitioned iframe 中默认不可读(除非显式设置 Cookie: SameSite=None; Secure 并用户授权),这也是辅助判断依据。
真正能做的只有适配,而不是“关掉”
你不能在 HTML 里加个属性就停用 Storage Partitioning,浏览器不给这个开关。可行路径只有:
- 改用第一方上下文:把第三方脚本改为由主站同域代理(如
/proxy/b-analytics.js),使其 origin 变成主站,从而避开分区 - 迁移到无状态方案:用 URL 参数、
postMessage传参、SharedWorker(注意它也受 partitioning 影响)或服务端 session - 对 IndexedDB / Cache API,明确使用
storageKey(仅 Chromium 支持实验性document.storageKey)做显式分区标识,便于调试 - 避免依赖第三方 iframe 内的
localStorage存关键态——它本来就不可靠,Partitioning 只是让这个问题暴露得更早
最常被忽略的一点:即使你在本地开发用 file:// 协议打开 HTML,Chrome 也会对 iframe 中的 http/https 资源启用 partitioning,导致测试环境与生产行为不一致。务必用 http://localhost 启服务验证。
前端入门到VUE实战笔记:立即使用
在学习笔记中,你将探索 前端 的入门与实战技巧!











