Chrome网站检测PC连接显示器数量 解决复制屏检测问题

原有实现的核心问题 #

• 你之前使用的Presentation API定位是投屏会话管理接口，并非硬件枚举接口，它只会识别处于独立扩展显示空间的屏幕
• 当用户开启显示器复制模式时，操作系统会把多块物理屏幕映射到同一个逻辑显示输出空间，所有屏幕的坐标参数完全重叠，API自然无法感知到额外的物理屏幕连接

可落地的兼容解决路径 #

1. 交叉特征校验识别复制模式场景 #

浏览器沙箱限制下，没有网页API可以直接无感知读取物理显示器总数量，但可以通过多维度参数交叉判断区分单屏和复制多屏场景：

• 采集当前界面的逻辑分辨率、设备像素比、系统任务栏位置信息做基线存储
• 通过创建不可见的测试窗口，从当前屏幕的右边界逐像素向右移动，检测窗口的逻辑坐标偏移值：如果移动时坐标无连续偏移、窗口最终仍在同一逻辑区域内，说明当前处于复制模式而非单屏环境
• 该逻辑可直接补全原有Presentation API检测的盲区，不需要用户额外授权

2. 借助Chrome专属屏幕详情接口做精准检测 #

在页面处于HTTPS环境时，可通过用户手动交互触发的getScreenDetails()接口获取系统所有显示设备的详情列表：

• 该接口在用户完成授权后，无论显示器是扩展还是复制模式，都会返回和物理连接数量匹配的显示条目，不会出现复制模式下条目缺失的问题
• 注意该接口无法在页面加载的无交互场景下静默调用，必须绑定用户的主动点击/滑动等操作触发授权弹窗，避免被浏览器安全策略拦截

3. 业务规则适配调整 #

检测逻辑不要单纯依赖逻辑屏幕的数量做判断，需在识别到复制模式时，直接按照“连接超过1台显示器”的规则触发访问限制，匹配你的业务管控要求

实现注意事项 #

• 不要单独依赖window.screen的宽高值判断屏幕数量：复制模式下所有屏的宽高完全一致，和单屏参数无差异
• 不要将Presentation API的返回结果作为多屏判定的唯一依据：部分不支持投屏协议的老旧显示器，即使物理连接了主机，也不会被该API枚举

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