唯一可靠方案是用 sandbox 属性在加载前禁用跳转权限，因子页面执行 top.location.href 时父页面无法拦截；正确配置需显式排除 allow-top-navigation，空 sandbox 最严格但可能破坏功能。
根本防不住——子页面执行 top.location.href 时，父页面没有拦截能力，这不是 bug，是浏览器设计使然。唯一可靠方案是用 sandbox 属性在加载前就禁用跳转权限。
为什么 window.top.location 跳转无法被父页 JS 拦截
子页面只要能执行 JS，就能直接改写 top.location，这个操作发生在顶层浏览上下文，父页面的监听、重写、postMessage 都晚了一步。常见误区包括：
- 在父页加
window.addEventListener('beforeunload', ...)—— 不触发，因为不是父页主动跳转 - 尝试覆盖
iframe.contentWindow.top.location—— 跨域时访问即报SecurityError，同域时 sandbox 已控制权限，覆盖无效 - 用
try/catch包住子页 JS —— catch 不到导航行为，只捕获脚本错误
sandbox 属性必须显式禁用 allow-top-navigation
sandbox 是唯一在 HTML 加载阶段就切断跳转能力的机制，但配置极易出错：
- 写
sandbox="allow-scripts"→ 允许脚本运行，且默认仍允许top.location写入（Chrome/Firefox 行为） - 写
sandbox="allow-scripts allow-same-origin"→ 同样不阻止跳转，除非你明确不包含allow-top-navigation - 正确写法：
sandbox="allow-scripts allow-same-origin allow-forms"（不含任何allow-top-navigation*） - 空 sandbox：
sandbox=""→ 最严格，连脚本都不让运行，但可能破坏子页功能
验证是否生效：控制台执行 document.querySelector('iframe').sandbox.contains('allow-top-navigation')，返回 false 才算成功。
文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。
子页面自己检测嵌套并阻断跳转只是辅助手段
子页可加如下代码，但它依赖两个前提：子页 JS 被允许执行 + 必须抢在跳转前运行：
<script>
try {
if (window.top !== window.self) {
window.stop();
throw new Error('Embedded context: blocked auto-redirect');
}
} catch (e) {}
</script>
这个逻辑有硬伤：
- 若父页用了
sandbox=""或没开allow-scripts，这段 JS 根本不执行 - 若子页用
srcdoc注入恶意 HTML，绕过所有外部脚本控制 - 一旦跳转开始（比如
top.location.replace()），JS 层面无法“拉回”页面
真正需要跳转时，必须由父页统一管控
如果子页确实要触发导航（如登录后跳首页），流程必须反转：子页发信号，父页执行跳转，并校验来源：
- 子页调用：
window.parent.postMessage({ type: 'navigate', url: '/dashboard' }, 'https://yourdomain.com') - 父页监听：
window.addEventListener('message', e => { if (e.origin === 'https://child.example.com' && e.data.type === 'navigate') { location.href = e.data.url; } }) - 绝对不要让子页在
message回调里执行top.location—— 它的top就是自己，不是你的父页
最容易被忽略的是：即使 sandbox 生效、JS 检测也跑通，子页仍可能通过 document.write('<meta http-equiv="refresh" content="0;url=https://evil.com">') 或 <iframe src="javascript:top.location='...'"></iframe> 触发跳转——这些行为同样受 sandbox 控制，但开发者常忘了测试这类非 JS 路径。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
