标准答案
- iframe 的风险可以分三层看:嵌入页面能执行什么行为、能使用哪些浏览器能力、以及当前页面会暴露多少来源信息。
- sandbox 是行为沙箱。加上 sandbox 后,浏览器默认限制脚本、表单、弹窗、同源能力和顶层跳转,再用 allow-scripts、allow-forms 等 token 按需放开。
- allow 是权限策略,用来控制 iframe 能不能使用 fullscreen、camera、microphone、clipboard-write 这类浏览器能力。
- referrerpolicy 控制请求 iframe 地址时 Referer 头带多少来源信息,避免泄露完整 URL 或敏感路径。
- 第三方 iframe 要按最小权限配置,尤其要谨慎同时放开 allow-scripts 和 allow-same-origin。
题目解析
- sandbox:限制嵌入页面能做什么,例如是否能执行脚本、提交表单、打开弹窗。
- allow:限制嵌入页面能调用哪些浏览器特性,例如 fullscreen、camera、microphone。
- referrerpolicy:限制当前页面 URL 作为来源信息暴露给 iframe 地址。
sandbox 同时放开 allow-scripts 和 allow-same-origin 时要非常谨慎。如果 iframe 页面和当前站点同源,它可能通过脚本移除 sandbox 限制,沙箱隔离意义会下降。
第三方 iframe 不要随意给 camera、microphone、clipboard-write 等权限,除非业务真的需要。
代码示例
嵌入第三方内容时,权限应该按最小化原则逐项放开。
HTML
<iframe
src="https://example.com/embed"
sandbox="allow-scripts allow-same-origin"
allow="fullscreen"
referrerpolicy="strict-origin-when-cross-origin"
title="第三方内容预览"
></iframe>常见误区
- 认为 iframe 天然隔离,实际上不配置权限时仍可能有隐私和权限风险。
- 只写 allowfullscreen,不理解 allow 权限策略。
- 忽略 title,导致屏幕阅读器用户不知道这个 iframe 是什么。