disableremoteplayback是html5 video标签唯一原生支持的禁用远程投屏提示属性，仅向浏览器发出禁用投屏信号，chrome/edge和safari（ios 15.4+/macos 12.3+）响应并隐藏ui入口，firefox完全忽略，无法阻止系统级镜像或物理盗录。
原生 <video></video> 标签**无法真正防投屏**，所有 HTML 属性都只是“提示浏览器别显示投屏入口”，不是策略 enforcement。Chrome 和 Safari 会响应，Firefox 直接忽略，系统级投屏（如 AirPlay 镜像、Windows 投影）完全不受影响。
disableRemotePlayback 属性怎么写才生效
它必须作为布尔属性直接存在，不赋值、不加引号、不拼错：
<video controls disableremoteplayback><source src="video.mp4" type="video/mp4"></source></video>
以下写法全部无效：disableRemotePlayback="true"、disableRemotePlayback="disabled"、disableremoteplayback（大小写错误）、disable-remote-playback（连字符错误）。
该属性只影响 Chrome/Edge（Chromium 内核）和 Safari（iOS 15.4+/macOS 12.3+）的 UI 显示：隐藏地址栏 Cast 图标、禁用右键菜单里的“投射到设备”选项。在 Firefox 中设了也等于没设。
controlsList="noremoteplayback" 的实际效果
这个值和 disableRemotePlayback 功能重叠，但行为更不稳定：
-
controlsList是枚举字符串属性，多个值用空格分隔，例如：controlsList="nodownload noremoteplayback" - Chrome 支持
noremoteplayback，Safari 也支持（但仅限 AirPlay 按钮），Firefox 完全不识别该值 - 它只隐藏按钮，不阻止用户通过系统级方式投屏（比如 macOS 的“屏幕镜像”或 iOS 控制中心的 AirPlay）
- 如果同时用了
disableRemotePlayback和controlsList="noremoteplayback"，属于冗余，无叠加增强效果
为什么加了属性还是能投屏？常见误解点
很多团队上线后发现“明明写了 disableRemotePlayback，用户照样能 AirPlay”，原因很实在：
- 用户没点视频控件上的投屏按钮，而是直接从系统控制中心/菜单选择“镜像此屏幕”——这绕过所有 HTML 属性
- 移动端 Safari 在部分场景下（如视频未自动播放、未聚焦、跨域资源）本就不显示 AirPlay 按钮，加了属性也看不出变化
- Android WebView 或微信内置浏览器对这两个属性支持极差，有些版本直接当不存在
- 即使按钮被隐藏，开发者工具里仍可调用
video.webkitShowPlaybackTargetPicker()（WebKit 内核）手动唤起投屏选择器
真正需要防外泄的业务（如金融培训、内部课程），不能依赖这些前端提示属性，而应聚焦服务端鉴权、DRM 加密、动态水印和播放环境检测——HTML 层面的设置，最多算一道礼貌性门槛。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
