海洋 CMS 播放器不能全屏播放怎么修复

海洋CMS站点播放器点全屏没反应，九成以上是播放 iframe 少了 allowfullscreen 属性——在播放页模板的 iframe 标签里补上 allowfullscreen="allowfullscreen"，再清一次缓存，问题基本就解决了；如果补完还不行，按下面的顺序排查 CSS 祖先元素和用户手势问题。

为什么海洋CMS的播放器会点不动全屏？

结论：海洋CMS 的视频通常是一个 <iframe> 内嵌加载的（播放页模板里的 iframe 指向 player 目录），而 HTML 规范要求 iframe 必须显式声明 allowfullscreen，浏览器才允许它内部调用全屏 API。

没写这个属性，播放器里的全屏按钮点了不会有任何反应，肉眼看起来像"按钮坏了"。allowfullscreen 是布尔属性，写成 allowfullscreen 或 allowfullscreen="allowfullscreen" 都生效；为了兼容老内核，习惯上还会同时加 webkitallowfullscreen 和 mozallowfullscreen。

具体改哪个文件、加哪几行代码？

结论：在播放页模板里找到 <iframe，把下面三个属性补进标签即可。

1. 定位文件：常见路径是 /template/你的模板目录/html/play.html，有的模板放在 /templates/模板名/play.html，还有的播放器单独成 player.html。用编辑器在模板目录里全局搜索 <iframe，凡是加载播放器的那一个就是目标。
2. 改标签，推荐整行替换成这样：

<iframe src="/player/?url=..." allowfullscreen="allowfullscreen"
        webkitallowfullscreen="webkitallowfullscreen"
        mozallowfullscreen="mozallowfullscreen"
        allow="autoplay; fullscreen"
        frameborder="0" scrolling="no"></iframe>

1. 如果 iframe 是 JS 动态创建的，改 JS 而不是 HTML：

var ifr = document.createElement('iframe');
ifr.setAttribute('allowfullscreen', 'true');
ifr.setAttribute('allow', 'autoplay; fullscreen');

1. 保存后清缓存：后台若有「系统 → 缓存管理／更新缓存」先点一次，再按 Ctrl+F5 强刷页面；挂了 CDN 的要刷新 CDN 缓存，否则你改的文件根本没到浏览器。

加了 allowfullscreen 还是不能全屏，怎么排查？

结论：按"控制台 → 用户手势 → CSS → 第三方"四步走，通常 5 分钟内能定位。

• 控制台：F12 打开 Console，点全屏按钮看有无红字报错；再在 Console 输入 document.fullscreenEnabled 回车，返回 false 说明浏览器层面禁用了全屏（常见于部分内嵌浏览器、隐私类插件）。
• 用户手势：全屏 API 必须在 click 这类用户手势里同步调用。如果代码写成 setTimeout(function(){ el.requestFullscreen(); }, 300) 或在 ajax 回调里调用，浏览器会直接拒绝，这类写法必须改回点击事件里直接调用。
• CSS：检查播放器容器的所有祖先元素，只要有一个带 transform、filter 或 perspective，就会创建新的包含块，导致 position: fixed 的全屏层只撑满一小块。
• 第三方：用无痕窗口打开再试一次，如果无痕下正常，就是广告拦截、录屏类扩展吃掉了全屏请求。

全屏后黑屏或只占一小块怎么办？

结论：这是 CSS 问题，不是权限问题，处理办法是把播放器容器在全屏时挂到 body 下。

监听 fullscreenchange 事件，进入全屏时执行 document.body.appendChild(playerBox)，退出时再放回原来的父节点，这样就能绕开所有祖先元素的 transform 干扰。同时保证播放器容器 width: 100%、height: 100%，外层不要写死 height: 500px 这类固定值，用 aspect-ratio: 16 / 9 做比例更稳。

手机端和微信里不能全屏怎么处理？

结论：微信、QQ 内置浏览器会接管视频播放，不开放网页全屏 API，这不是模板能改的，只能引导用户"在浏览器中打开"。

iOS Safari 从 iOS 10 起默认内联播放，video 标签加 playsinline 可避免自动弹全屏，用户点系统控件仍能全屏；微信内建议做一条提示，引导用户点右上角「…」→ 在浏览器打开。移动端还建议尽量别用 iframe 套播放器，直接在同一页面渲染 video，能大幅降低全屏失败率。

改完不生效的常见坑

结论：八成是缓存没清，或者改错了模板目录。

海洋CMS 有模板缓存机制，改完模板必须更新缓存；服务器若开了 OPcache 或 CDN，也要一并刷新。另外很多站点根目录下放了好几套模板，务必确认改的是后台当前启用的那一套；播放列表页、详情页如果也内嵌了 iframe，记得一起加上 allowfullscreen，不然会出现"播放页能全屏、列表页不能"的怪现象。

总结一句：先补 allowfullscreen，再清缓存强刷；还不行就看控制台报错、检查祖先元素的 transform 和全屏调用是否在用户手势里，最后再区分是不是微信内置浏览器的限制。