controlslist="noremoteplayback"仅隐藏投屏按钮而不阻止实际投屏，真正禁用远程播放需使用disableRemotePlayback布尔属性，且须在视频加载前设置、兼容Chrome/Edge但iOS Safari不支持。

controlslist="noremoteplayback" 不防投屏，只藏按钮

这个属性只是告诉浏览器“别在控件栏里显示 AirPlay / Chromecast 按钮”，它不干预底层协议，也不阻止系统级投屏行为。用户仍可通过 macOS 控制中心、Windows + K、Android 快捷设置等直接投整个屏幕——controlslist 对这类操作完全无效。

disableRemotePlayback 才是真正起作用的属性

要让视频不被识别为可投媒体，必须用 disableRemotePlayback 这个布尔属性：

• 必须写在 <video> 标签上，或 JS 动态设置：videoElement.disableRemotePlayback = true
• 必须在视频加载前设置（比如 DOM ready 后立即设，或标签里直接写）；播放中再设可能失效
• iOS Safari 完全忽略该属性（Apple 未实现），Android Chrome 和桌面 Chrome 支持较好
• 第三方播放器（如 hls.js、Video.js）会动态创建 <video> 元素，原始标签上的 disableRemotePlayback 不会继承过去，得在播放器实例化后手动设置

为什么加了还是能投屏？常见漏点

不是属性没用，而是实际部署时容易踩坑：

anything-to-html

将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。

下载

• 页面有多个 <video>，只给其中一个加了 disableRemotePlayback，其他没加的仍会被投屏菜单识别
• 用了 playsinline 或 webkit-playsinline，但误以为它们能禁投屏——其实两者无关，playsinline 只控制是否内联播放
• 依赖 controlslist="noremoteplayback" 却没配 controls，导致属性根本不起作用（controlslist 必须配合 controls 才生效）
• 在 Safari 上测试，却忘了它既不支持 disableRemotePlayback，对 controlslist="noremoteplayback" 的支持也极不稳定

真想限制投屏，光靠前端远远不够

前端属性只能影响浏览器 UI 层和部分 API 响应，无法阻挡：

立即学习“前端免费学习笔记（深入）”；

• 系统镜像投屏（如 macOS 镜像、Windows 投射到此电脑）
• 用户用录屏软件捕获画面
• 抓包获取视频 URL 后本地播放再投

如果业务确实需要强保护，得结合服务端 Token 鉴权、HLS 分片加密、或集成 Widevine/FairPlay DRM ——disableRemotePlayback 只是第一道轻量提示，不是锁。