referrerpolicy属性仅控制iframe内部资源请求的referer头，不影响父页面url对子页面的可见性；防泄露需配合sandbox、srcdoc及后端referrer-policy响应头。
iframe 的 referrerpolicy 属性只影响 iframe 内部发起的请求，不是防父页 URL 泄露
很多人误以为给 <iframe></iframe> 加 referrerpolicy 能阻止子页面看到父页面地址——其实完全相反：referrerpolicy 控制的是 **iframe 里 JS、图片、脚本等资源向外部域名发起请求时，Referer 头里带什么内容**。它不阻止子页面读取 window.parent.location（除非子页面本身也设了 sandbox），也不隐藏父页 URL 对 iframe 的可见性。
真正要防后台 URL 泄露，得看两个方向：一是防止 iframe 内部资源请求把父页地址发给第三方；二是防止子页面主动上报或泄露父页路径。前者 referrerpolicy 确实管，后者它完全不管。
referrerpolicy="no-referrer" 在 iframe 上的实际效果
当 iframe 源自第三方（比如 src="https://widget.example.com"），且它内部加载一张图：<img src="https://tracker.com/pixel.gif?x-oss-process=image/resize,p_40">，此时 Referer 值由 iframe 元素的 referrerpolicy 决定：
-
referrerpolicy="no-referrer"→ 请求头里没有Referer:字段，tracker.com 收不到任何来源信息 -
referrerpolicy="origin"→ Referer 是https://your-site.com，不含路径和参数 - 没设或拼错 → 回退到默认策略
no-referrer-when-downgrade，HTTPS→HTTPS 时仍可能发完整 URL（如https://your-site.com/admin/dashboard?token=abc）
所以，如果你的后台页面嵌了第三方 widget，而该 widget 又会向外部发请求（埋点、广告、字体），加 referrerpolicy="no-referrer" 就能切断它把你的敏感路径（比如 /admin/、?session_id=）暴露出去的链路。
为什么只加 referrerpolicy 不够？必须搭配 sandbox 和 srcdoc
单靠 referrerpolicy 无法防子页面 JS 主动获取或上报父页 URL。以下组合才构成基础防护：
-
sandbox="allow-scripts"（或更严格地去掉allow-scripts）→ 阻止子页面执行 JS，也就无法调用window.parent.location.href -
srcdoc替代src→ 内联 HTML，不加载外部页面，彻底规避跨域上下文和 Referer 问题 -
referrerpolicy="no-referrer"→ 确保 iframe 内部所有资源请求都不带 Referer - 后端响应头加
Referrer-Policy: no-referrer→ 覆盖 iframe 内 JS 发起的fetch()请求（referrerpolicy属性对 fetch 无效）
特别注意：sandbox 默认禁用 window.parent 访问，但若你显式写了 allow-same-origin，就等于开放了全部父页上下文——这时 referrerpolicy 再严也没用，子页面可直接读取 parent.location。
容易被忽略的失效场景
即使代码写对了，这些情况也会让 referrerpolicy 形同虚设：
- 目标 iframe 页面自身设置了
<meta name="referrer" content="unsafe-url">→ 它会覆盖父页的referrerpolicy属性（仅限该页面内发起的请求） - 浏览器不支持该属性（Safari ≤15.4、旧版 Android WebView）→ 静默降级为默认策略，敏感路径照发
- CDN 或反向代理在中间重写了 Referer（比如强制添加白名单校验字段）→ 前端设置被绕过
- 你测试时看 DevTools Network 面板，发现 Referer 缺失，但实际服务端收到的仍是完整 URL → 可能是浏览器重定向或缓存干扰，必须用本地接收服务验证原始请求头
最稳妥的做法：后台管理页这类高敏页面，优先用 srcdoc 内联轻量 widget；若必须外链，referrerpolicy="no-referrer" + sandbox + 后端响应头三者缺一不可——少一个，URL 泄露风险就多一分。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
