浏览器端JavaScript能否检测设备是否通过HDMI连接外接显示设备？

核心结论 #

目前浏览器环境下不存在100%可靠的纯前端方案可以直接检测PC端是否通过HDMI连接了外接镜像显示器。

现有API的实际限制 #

• 你测试过的Presentation API、Remote Playback API现有主流浏览器实现仅覆盖*casting（投屏）*场景，也就是第二屏独立加载独立内容的使用场景。虽然W3C规范标注支持1-UA镜像模式，但所有常见浏览器均未实现这部分能力，自然无法检测HDMI镜像的显示设备。
• 浏览器出于用户隐私保护的设计，不会向网页暴露显示设备的硬件接口类型（HDMI/DP/VGA等）、设备分类（电视/显示器/投影仪等）这类底层信息，无法直接筛选出HDMI连接的外接电视设备。

可选降级方案（存在误判可能） #

如果可以接受一定的误判率，可通过多屏窗口放置API做间接判断：

1. 先向用户申请多屏权限，调用window.getScreenDetails()接口获取所有显示设备信息
2. 读取screen.isExtended属性，当返回值为true时说明设备当前连接了至少一台额外显示设备，此时可触发播放暂停逻辑
3. 可监听screenschange事件，在显示设备列表发生变化时重新触发检测逻辑

注意：该方案只能判断是否存在多屏，无法区分接口类型、无法区分是扩展模式还是镜像模式，用户连接Type-C扩展屏、虚拟显示器都会触发检测逻辑，误判率较高。

强需求实现建议 #

如果你的业务属于版权管控这类强要求场景，纯前端方案无法满足需求，建议配套开发PC端桌面客户端：

• 客户端可以直接调用系统原生API获取所有显示设备的完整硬件信息，包括接口类型、设备名称、分辨率等参数，可以精确识别HDMI连接的电视设备
• 客户端可通过本地接口、WebSocket等方式和Web页面通信，同步检测结果来控制播放逻辑

内容的提问来源于stack exchange，提问作者shiva kumar