空sandbox属性即全锁死，js不解析、表单不提交、弹窗失效、localstorage不可读写，仅postmessage可用；必须显式添加allow-scripts等权限token才能逐项放行，且需配合referrerpolicy、csp等纵深防护才构成真正安全隔离。
sandbox 属性不是“加了就安全”，而是“加了就锁死”——只要出现该属性（哪怕值为空），iframe 内所有主动行为立刻被浏览器底层拦截，JS 不解析、表单不提交、弹窗失效、localStorage 不可读写，仅 postMessage 保持可用。
空 sandbox 会导致白屏或 net::ERR_BLOCKED_BY_RESPONSE
写成 <iframe src="widget.html" sandbox></iframe> 或 <iframe sandbox=""></iframe>，等价于启用全部限制：Network 面板里会显示 net::ERR_BLOCKED_BY_RESPONSE，iframe 渲染区空白，控制台静默无报错。这不是加载失败，是内容根本没被解析。常见误判是以为路径错了或 JS 语法有问题，其实只需在控制台执行 document.querySelector('iframe').sandbox，返回空 DOMTokenList [] 就能确认权限未开启。
allow-scripts 是第三方组件的最低可行权限
广告、图表、统计脚本等依赖 JS 执行的组件，至少需要 allow-scripts 才能运行。但要注意它只解禁外链脚本（<script src="https://cdn.example.com/widget.js"></script>），并不恢复以下能力：
-
onclick、onload、javascript:void(0)等内联事件处理器仍被屏蔽，必须改用addEventListener -
document.write()、同步XMLHttpRequest、eval()仍被禁止 -
window.origin强制为"null"，无法访问window.parent或父页 DOM -
window.localStorage、document.cookie绑定到临时匿名上下文，刷新即丢
allow-same-origin 和 allow-top-navigation 极易越权
allow-same-origin 只有在 src 与父页协议、域名、端口完全一致时才生效；否则浏览器静默忽略该 token，但暴露配置疏漏。例如：sandbox="allow-scripts allow-same-origin" 加载 https://third-party.com/widget.html，allow-same-origin 实际无效，localStorage 依然不可读写，DOM 依然隔离——你以为开了同源权限，其实什么都没变。
allow-top-navigation 允许 iframe 修改顶层页面地址（如 top.location = 'https://evil.com'），生产环境应绝对避免；若需跳转，优先使用 allow-top-navigation-by-user-activation（仅允许用户点击后触发）。
验证 sandbox 是否生效和最小权限配法
别靠猜，直接查：document.querySelector('iframe').sandbox 返回的 DOMTokenList 就是当前实际启用的权限列表。按真实场景选最小组合，拒绝堆砌：
- 只展示带 JS 的广告/图表：
sandbox="allow-scripts allow-popups" - 嵌入用户填写的问卷：
sandbox="allow-scripts allow-forms allow-popups" - 加载同源可信子系统（如
https://yourapp.com/internal.html）：sandbox="allow-scripts allow-same-origin allow-forms" - 绝对不要写：
sandbox="allow-scripts allow-same-origin allow-popups allow-forms allow-top-navigation"——这和没加sandbox几乎一样危险
真正可控的安全隔离，必须显式声明最小权限，并叠加 referrerpolicy="no-referrer"、loading="lazy"、srcdoc 和服务端 Content-Security-Policy: frame-ancestors 等纵深措施。单独用 sandbox，连起点都算不上。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
