controlslist="noremoteplayback"是最通用的隐藏投屏按钮写法，需配合controls使用，仅影响UI展示，不阻止已建立的投屏会话，且在微信/QQ等X5内核浏览器中无效。
controlslist="noremoteplayback" 是最通用的隐藏投屏按钮写法
Chrome、Edge 和较新版本 Safari 都识别 controlslist，它能直接从原生控件栏里移除 Cast/AirPlay 图标，比 disableRemotePlayback 兼容性更好。注意它必须和 controls 一起用，否则整个控制条都不显示。
常见错误是漏掉空格或加引号：controlslist="noremoteplayback" ✅，controlslist="no-remote-playback" ❌，controlslist=noremoteplayback（没引号）在部分解析器中也会失效。
-
controlslist只影响 UI 展示，不阻止已建立的投屏会话（比如用户先点 Cast 再刷新页面） - 多个指令用空格分隔，例如：
controlslist="nodownload noremoteplayback nofullscreen" - 微信内置浏览器、QQ 浏览器（X5 内核）大概率忽略该属性，需通过
navigator.userAgent检测并降级提示
disableRemotePlayback 必须写成无值布尔形式才生效
disableRemotePlayback 不是开关，只是向浏览器发一个“请勿投屏”的提示信号。它只在 Chrome/Edge 中稳定起作用，Safari 从 iOS 15.4 起支持 AirPlay 禁用提示，Firefox 完全不识别。
最常踩的坑是写成带值形式：disableRemotePlayback="true" 或 disableRemotePlayback="disabled" —— 这两种写法都会被浏览器彻底忽略。
- 正确写法只有一种：
- 动态设置（如
videoEl.setAttribute('disableRemotePlayback', '')）在 Safari 和部分 Android WebView 中可能无效，建议初始化时就声明 - 该属性对系统级屏幕镜像（如 macOS 镜像、Windows 投影到此电脑）完全无影响
第三方播放器里 controlslist 和 disableRemotePlayback 通常不起作用
如果视频是通过 嵌入的腾讯云、阿里云 SDK 或自研播放器，这些原生 HTML 属性大概率被封装层拦截——因为最终渲染的是 iframe 内部的 video 标签，外部页面的属性无法穿透。
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
此时前端能做的有限但关键：检查播放器文档是否暴露了禁用投屏的配置项（如阿里云 Web SDK 的 disableCast 参数），或监听其内部事件做兜底。
- 若播放器提供
onEnterPictureInPicture回调，可立即调用video.exitPictureInPicture()（需用户手势上下文） - 监听
webkitbeginfullscreen或visibilitychange，检测异常全屏/切后台行为并暂停视频 - 搭配
crossorigin="anonymous"+ 后端Access-Control-Allow-Origin: null，防止非同源脚本读取视频元信息
隐藏按钮 ≠ 禁用功能，真正防投屏得靠服务端配合
所有前端手段都只是 UI 层遮蔽，用户仍可通过快捷键（F11、Cmd+Shift+F）、调试工具或抓包绕过。真正的防线在服务端：动态 token 鉴权 URL、.m3u8 接口校验登录态、短时效且绑定 UA/IP 的播放凭证。
尤其要注意 HLS 场景：.m3u8 文件本质是纯文本，若被电视浏览器直接访问就能播；应把路径设为登录态接口（如 /api/play.m3u8?token=xxx），而非静态资源地址。
智能电视上更需物理隔离思路——前端再怎么藏按钮，只要电视能发现并连接你的设备，投屏就成立。关 Wi-Fi、拔网线、禁用电视端多屏互动设置，才是立竿见影的手段。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
