sandbox 属性默认禁用所有能力，必须显式声明 allow-scripts 等权限；allow 属性在新浏览器中替代旧 allowfullscreen 控制功能；还需检查响应头、csp 及加载时机。
检查 sandbox 属性是否禁用关键能力
sandbox 是 iframe 最容易被忽略的“静默杀手”，它默认启用全部限制，不显式声明就等于关掉所有权限。比如 sandbox="allow-forms" 看似开了表单，但 onclick、addEventListener 仍会失效——因为缺了 allow-scripts。
常见错误现象：console.log 不输出、按钮点击无反应、requestFullscreen() 报错但控制台没报 JS 错误；跨域 iframe 里子页面 JS 完全不执行。
- 必须确认
sandbox值中包含allow-scripts（基础前提），否则脚本一律被拦截 - 需要全屏时补
allow-fullscreen（注意：不是allowfullscreen，后者是旧名，已废弃） - 要弹窗或调用
window.open，得加allow-popups -
sandbox是白名单机制，写错拼写（如allow-script少 s）或空格分隔错误（如allow-scripts allow-forms中间多空格）都会导致整项失效
验证 allow 属性是否匹配浏览器新旧标准
Chrome 80+ 和 Firefox 73+ 已全面切换到 Permissions Policy（原 Feature Policy），allow 属性现在才是控制媒体、传感器、全屏等能力的主开关，而旧的 allowfullscreen 只作兼容层存在。
常见错误现象：本地开发正常，嵌入第三方后台后全屏/摄像头/陀螺仪功能突然失效；控制台报 Permissions policy violation: fullscreen is not allowed 或类似 accelerometer 报错。
-
allowfullscreen必须保留（兼容老浏览器），但真正起效的是allow="fullscreen; accelerometer; gyroscope; clipboard-write" - 多个权限用分号 + 空格分隔，不能用逗号，也不能漏掉结尾分号（
allow="fullscreen "末尾空格会导致解析失败） - 若需访问剪贴板，
clipboard-write必须配合用户手势（如 click），且目标元素不能是iframe自身，而是其内部可聚焦元素 - 在 iOS Safari 上，
autoplay还需额外加playsinline到<video></video>标签内，仅靠allow不够
排查跨域 iframe 下的响应头与 CSP 限制
即使 sandbox 和 allow 都写对了，父页面或子页面的 HTTP 响应头仍可能直接封杀 iframe 行为。这类限制不会报 JS 错误，只在 Network 面板或 Console 的安全警告里出现。
常见错误现象：iframe 显示空白但无加载错误；点击下载链接无反应；postMessage 发送成功但对方收不到；控制台出现 Refused to frame 'xxx' because an ancestor violates the following Content Security Policy directive。
- 子页面响应头中若有
X-Frame-Options: DENY或Content-Security-Policy: frame-ancestors 'none'，iframe 直接被拒载 - 父页面若设置了
Permissions-Policy: fullscreen=()（空括号表示禁用），则无论 iframe 怎么配都无效 - 跨域下载失败常因子页面缺失
Content-Disposition: attachment，或父页面 CSP 拦截了frame-src或child-src - 调试时先在地址栏单独打开子页面 URL，再看 Response Headers，比查 iframe 请求更可靠（有些重定向会掩盖真实头）
确认 iframe 加载时机与 DOM 访问边界
很多“兼容问题”其实是操作时机错了：你写的 JS 在 iframe 还没加载完就去访问 contentDocument，或者在跨域下硬试 iframe.contentWindow.document，结果不是 null 就是抛 DOMException。
常见错误现象：iframe.onload 触发后立即查 document.getElementById 返回 null；动态插入 iframe 后立刻调 requestFullscreen() 失败；控制台报 Blocked a frame with origin ... from accessing a cross-origin frame。
- 同源 iframe：等
iframe.onload或iframe.addEventListener('load', ...)，再访问iframe.contentDocument - 跨域 iframe：永远不要尝试读取其
contentDocument，只能靠postMessage通信；子页面需主动发消息，父页监听message事件并校验event.origin -
iframe.src改变后，旧的contentWindow引用会失效，必须重新绑定 load 事件 - 避免在
DOMContentLoaded里就操作 iframe，它和 iframe 加载无同步关系
真正卡住人的从来不是某个属性写错，而是多个限制层层叠加：sandbox 关脚本 → allow 漏权限 → 响应头再拦一次 → JS 又在错时机访问。排查时得一层层剥开，而不是盯着 console 里第一行报错猛改。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
