allowfullscreen属性正确写法是allowfullscreen（无值）或allowfullscreen=""，跨域iframe需同时设置allowfullscreen和allow="fullscreen"，且须检查permissions-policy响应头是否禁用fullscreen、sandbox是否缺失allow-scripts、全屏触发是否在子页用户手势内。
allowfullscreen 属性写对了没
最常见问题是拼写或语法错误，浏览器会静默忽略，不报错也不生效。
-
allowfullscreen="true"是冗余写法，布尔属性不需要值；正确写法是allowfullscreen（无值）或allowfullscreen="" -
allow="full-screen"或allow="allow-fullscreen"都无效，必须是精确字符串allow="fullscreen" - 跨域 iframe 必须同时写
allowfullscreen和allow="fullscreen"，只写一个大概率失效（尤其 Chrome 120+、Safari 13.1+） - 旧版兼容可加
webkitallowfullscreen和mozallowfullscreen，但不是必须
父页面 Permissions-Policy 响应头是否禁用了 fullscreen
HTTP 响应头里的 Permissions-Policy: fullscreen 'none' 会直接覆盖 HTML 中所有 allow 属性，哪怕你双写也白搭。
- 打开 Chrome DevTools → Network → 刷一次页面 → 点开父页面的 HTML 请求 → 查看 Response Headers
- 如果存在该策略，删掉它比改前端更有效；若无法改服务端，需联系后端移除或改为
fullscreen 'self' - 同理检查
Feature-Policy（已废弃但部分老环境仍生效），也需一并清理
iframe 是否带 sandbox 且缺失 allow-scripts
带 sandbox 的 iframe 默认禁用 JS，子页根本跑不起来，requestFullscreen() 根本不会执行。
- 如果用了
sandbox，必须显式加上allow-scripts：sandbox="allow-scripts" - 仅
sandbox（无值）或sandbox=""会禁用所有脚本，全屏调用连入口都进不去 - 验证方式：在子页控制台手动执行
document.fullscreenEnabled，返回false就说明权限没拿到
全屏触发是否发生在 iframe 内部用户手势中
父页面按钮点击后调用 iframe.contentWindow.document.documentElement.requestFullscreen() 必然失败——浏览器根本不认这种“跨上下文”的手势传递。
- 触发点必须在 iframe 子页内部：比如子页里放一个
<button onclick="document.getElementById('player').requestFullscreen()"></button> - 不能在
iframe.onload、setTimeout、fetch().then()中调用，否则抛NotAllowedError: API can only be initiated by a user gesture - 跨域 iframe 下，父页甚至拿不到
contentWindow，postMessage通知子页自己触发是唯一可行路径 - 子页进入全屏后，父页的
document.fullscreenElement永远为null，别指望它指向 iframe 元素
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
