disableRemotePlayback和controlsList="noremoteplayback"均为提示性属性，非强制拦截；前者须以无值布尔形式书写，仅Chromium系稳定支持，Safari部分支持，Firefox不支持；后者需与controls共存且仅Chromium支持，均无法阻止系统录屏或整页投射。
disableRemotePlayback 和 controlsList="noremoteplayback" 是目前 HTML5 中唯二能影响投屏 UI 的原生手段，但它们都只是“提示”，不是拦截——浏览器可执行、也可忽略，更无法阻止系统级录屏或物理盗录。
为什么 disableRemotePlayback 属性常被写错
这个属性必须以无值布尔形式存在，否则会被浏览器完全忽略：
-
disableRemotePlayback✅ 正确：浏览器识别为真值 -
disableRemotePlayback="true"❌ 错误：HTML 解析为字符串值，Chrome/Edge 视为无效 -
disableRemotePlayback="disabled"❌ 同样无效，不是合法布尔属性用法
它只对 Chromium 系（Chrome、Edge、部分 Android WebView）稳定生效；Safari 自 iOS 15.4 起支持 AirPlay 禁用提示，但行为偏保守；Firefox 完全不识别该属性。
controlsList="noremoteplayback" 的兼容性陷阱
controlsList 是另一个控制 UI 显示的属性，但它有硬性前提：
- 必须与
controls属性共存，否则整个控件栏都不出现，controlsList失效 - 仅 Chromium 支持，Safari 和 Firefox 不解析该属性（即使写了也当不存在）
-
noremoteplayback会隐藏 Cast/AirPlay 按钮，但不影响右键菜单里的“投射到设备”选项（某些 Chrome 版本仍保留）
常见误用： 缺少 controls → 播放器无任何按钮，用户连播放都无法触发。
真正起作用的防投屏，不在 HTML 标签里
前端 HTML 层面的所有属性，都只影响“是否显示投屏入口”，而非“能否投屏”。只要用户能访问视频资源 URL，就存在被截流、录屏、镜像的风险。关键防线在服务端和协议层：
- 视频分片（HLS/DASH）必须动态签名 + 短时效 Token，防止 URL 被复用或分享
- DRM 输出保护需启用：Widevine 设置
outputProtection: "HDCP_REQUIRED"，FairPlay 配置allowAirPlay: false - 敏感场景应监听
webkitbeginfullscreen或enterpictureinpicture，检测到即暂停并上报 - 避免使用明文
src="xxx.mp4"，优先走 MSE 加载，配合crossorigin="anonymous"支持后续 Canvas 水印
最易被忽略的一点：禁用投屏按钮 ≠ 阻止桌面投射。用户打开 Chrome 的 Cast 功能投整个标签页，你的 disableRemotePlayback 完全不生效。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
