HTML怎么在网页弹窗中做好视频防投屏-html教程-PHP中文网

disableRemotePlayback是HTML5 video标签唯一原生支持的禁用远程投屏提示属性，仅向浏览器发出禁用AirPlay/Chromecast信号，并非强制阻止；Chrome/Edge支持完整，Safari自iOS 15.4起部分支持，Firefox完全不识别，且必须以布尔形式书写，不可赋值。

html怎么在网页弹窗中做好视频防投屏

video 标签加 `disableRemotePlayback` 是唯一原生防投屏手段

它不是“阻止”，而是向浏览器发出“请勿启用 AirPlay/Chromecast”的提示信号。Chrome 和 Edge 支持最完整；Safari 自 iOS 15.4 / macOS 12.3 起支持 AirPlay 禁用提示；Firefox 完全不识别该属性，设了也无效。

必须写成布尔属性形式：<video controls disableremoteplayback></video>。以下写法全部失效：disableRemotePlayback="true"、disableRemotePlayback="disabled"、disableRemotePlayback=""（空字符串在部分浏览器里也被忽略）。

常见错误是把它当成 DRM 替代品——它既不加密视频流，也不影响系统录屏、手机拍摄或抓包下载。它只管“远程播放入口是否显示”，仅此而已。

搭配 `controlslist="noremoteplayback"` 提高 Safari 兼容性

虽然 disableRemotePlayback 是标准属性，但 Safari 对它的响应有时滞后或不一致。实测中，在 controlslist 里显式加上 noremoteplayback 能增强提示效果，尤其在 macOS 和 iOS 的较新版本中：

<video controls disableremoteplayback controlslist="nodownload nofullscreen noremoteplayback"><source src="lesson.mp4" type="video/mp4"></source></video>

controlslist 是非标准但广泛支持的扩展属性，Safari 对它的解析比原生 disableRemotePlayback 更早、更稳定。两者共存不冲突，属于“双保险”写法。

注意：controlslist 不是万能开关，它只影响控制条 UI 层面的按钮可见性，不能阻止用户通过系统菜单手动发起投屏（比如 macOS 菜单栏的 AirPlay 图标），但它能显著降低普通用户的误操作概率。

Wechat Article Html

将 Markdown 文章转换为微信公众号兼容的纯 HTML 格式。当用户要求"转成微信格式"、"生成公众号文章 HTML"、"排版到微信草稿箱"、"微信粘贴格式"时触发。输出带内联样式的纯 HTML，微信编辑器可直接渲染，无需额外适配。支持标题、段落、列表、粗体、行内代码、表格、引用块、代码块、配图的完整转换。

下载

监听 `webkitbeginfullscreen` 和 `enterpictureinpicture` 做业务级干预

当用户绕过 UI 尝试进入全屏或画中画时，这些事件仍可能被触发。你可以监听并执行警告、暂停、甚至跳转到提示页：

video.addEventListener('webkitbeginfullscreen', e => { video.pause(); alert('该视频不允许全屏播放'); })
video.addEventListener('enterpictureinpicture', e => { video.currentTime = 0; video.pause(); })

这类监听无法阻止系统级行为（比如 macOS 的全局快捷键），但能第一时间中断播放流程，配合服务端 token 过期或前端水印强化，构成轻量级防御链。

⚠️ 注意：不要在这些事件里调 video.requestFullscreen() 或 document.exitFullscreen()，容易引发循环或报错；重点是“响应+中断”，不是“对抗+覆盖”。