唯一可靠手段是iframe标签显式声明sandbox且不包含allow-top-navigation；sandbox=""可彻底禁用跳转，sandbox="allow-scripts"仍放行top.location写入，js检测和postmessage仅为补充，服务端csp frame-ancestors才是防嵌套第一道防线。
iframe 的 sandbox 属性必须显式禁用 allow-top-navigation
子页面执行 top.location.href 跳转父页，浏览器默认允许，JS 层面无法拦截。唯一可靠手段是在 <iframe></iframe> 标签上声明 sandbox，且**不包含** allow-top-navigation 或 allow-top-navigation-by-user-activation。
常见错误写法：sandbox="allow-scripts" —— 它只开脚本权限，但默认仍放行 top.location 写入；sandbox="allow-scripts allow-same-origin" 更危险，可能绕过同源限制并触发跳转。
- 最安全起点：
sandbox=""（空字符串），所有导航行为静默失败，连document.write和<form></form>提交都会被拦 - 需运行 JS 时，仅加最小集合：
sandbox="allow-scripts allow-forms allow-popups"，确认不含任何allow-top-navigation* - 动态 JS 设置
iframe.sandbox无效，必须写在 HTML 标签里
为什么 window.top !== window.self 检测基本没用
这个判断只能在子页面 JS 可执行的前提下起作用，而攻击者根本不需要让你的 JS 运行——比如用 srcdoc 注入恶意 HTML，或父页用了 sandbox=""，你的脚本压根不会执行。
即使它能跑，也必须抢在任何 DOM 渲染和事件绑定前执行，且要包裹 try/catch：访问 window.top 在某些沙箱策略下会直接抛 SecurityError。
- 典型失效场景：子页已开始加载链接、按钮可点击，检测代码却还在
里排队 - 误以为“检测到嵌套就
throw”就能阻止跳转——其实跳转早已触发，JS 中断只是副作用 - 该逻辑对
document.write或<meta http-equiv="refresh">完全无效
postMessage 不是用来“拦截”，而是用来“接管”跳转权
父页监听 message 并响应子页的跳转请求，不是为了拦，而是为了把控制权收回来。关键点在于：子页不能自己调 top.location，只能发信号；父页必须校验来源和内容结构。
- 父页发送消息时，
targetOrigin必须写死完整协议+域名+端口，例如'https://shop.example.com'，绝不能填'*' - 子页接收消息时，必须用
===严格比对event.origin，禁用includes()或正则模糊匹配 - 子页收到消息后，禁止执行
window.top.location.href—— 它的top是自身窗口，不是你的父页 - 父页收到合法消息后，由自己执行
window.location.href = data.url，这才是可控路径
服务端响应头才是第一道防线
前端 sandbox 只管 iframe 内部行为，但防止整个页面被恶意嵌套，得靠服务端返回的 HTTP 头。如果攻击者把你的登录页用 iframe 套进钓鱼站，sandbox 根本不生效。
- 优先配置 CSP：
Content-Security-Policy: frame-ancestors 'self' https://trusted.example.com'，比X-Frame-Options更灵活 - 若只支持老浏览器，退而用
X-Frame-Options: DENY或SAMEORIGIN - 注意：CSP 的
frame-ancestors与frame-src不同，后者控制谁可以被你嵌入，前者控制谁可以嵌入你 - HTTPS 页面加载 HTTP 子资源会触发混合内容拦截，此时 iframe 根本不加载，别误判为 sandbox 生效
真正容易被忽略的是：sandbox 配置是否生效，不能只看代码，得动手验证。打开开发者工具，选中 iframe 元素，执行 document.querySelector('iframe').sandbox，返回的 DOMTokenList 里绝对不能出现 allow-top-navigation；再手动在子页 console 执行 top.location.href = '@#@#@#@#@#@#@#@#@#@0'，确认报错或静默失败。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
