HTML中disableRemotePlayback是唯一原生投屏控制属性，须以布尔形式静态声明（如），不支持批量、跨页或防录屏，且对HLS/DASH未加密资源无效，关键防护应落于服务端鉴权与DRM。
HTML 视频没有“批量防投屏”这回事，disableRemotePlayback 是唯一原生支持的投屏提示属性，但它不强制、不跨页面、不阻止录屏，更无法“批量”生效——每个 标签都得单独声明，且只在部分浏览器起效。
disableRemotePlayback 必须写成布尔属性，不是字符串
常见错误是写成 disableRemotePlayback="true" 或 disableRemotePlayback="disabled"，这会让浏览器完全忽略该属性。它只能以无值形式存在：
<video controls disableremoteplayback><source src="lesson.mp4" type="video/mp4"></source></video>
- ✅ 正确：直接写
disableRemotePlayback（无等号、无引号、无值） - ❌ 错误：
disableRemotePlayback="true"、disableRemotePlayback=""、disableRemotePlayback="1" - 注意：动态 JS 设置
el.setAttribute('disableRemotePlayback', '')也无效；必须在 HTML 中静态声明或用el.disableRemotePlayback = true（但后者在 Safari 中可能不触发 UI 隐藏）
多页面不能靠 HTML 属性自动同步，得靠 localStorage + 初始化逻辑
你给 page1 的 加了 disableRemotePlayback，page2 不会因此自动带上——HTML 属性不跨页面。所谓“同步设置”，其实是让所有页面在加载时检查同一个开关状态，再决定是否渲染带该属性的 ：
- 用
localStorage.setItem('video-disable-airplay', 'true')统一开启策略 - 每个页面初始化时读取：
const shouldDisable = localStorage.getItem('video-disable-airplay') === 'true' - 然后动态生成或修改 video 元素：
if (shouldDisable) video.setAttribute('disableRemotePlayback', '')（注意：这里 JS 设置虽非标准推荐，但在 Chrome/Edge 中仍可触发右键菜单隐藏） - ⚠️ Safari 对 JS 动态添加该属性响应滞后，建议服务端渲染或首次加载即写死
真正容易被忽略的三个点
很多人花时间调 disableRemotePlayback，却漏掉更关键的防线：
- 它对系统级录屏（macOS QuickTime、Windows Xbox Game Bar）完全无效，连提示作用都没有
- 用户打开开发者工具 → Network 面板 → 找到 m3u8 或 mp4 请求 → 复制链接 → 粘贴到新标签页，照样能下载播放，
disableRemotePlayback对此零防护 - 若视频走 HLS/DASH，且未启用 DRM 或动态 token 鉴权，禁用投屏只是“关窗不锁门”——重点应放在服务端：Referer 校验、短期 JWT、IP 绑定、分片密钥轮换
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
