navigator.mediaDevices.enumerateDevices方法 的兼容性问题
经测试发现,除谷歌浏览器和现在使用Chromium内核的Microsoft Edge浏览器外,enumerateDevices()方法存在一些兼容性问题。
-
首先,如果不先获取媒体权限,用enumerateDevices()获取到的设备列表中label为空,即无法识别设备名字。这个考虑有两种方案解决:
? a)在调用enumerateDevices()时,对于label为空的情况手动定义设备名字,在进入会议调用getUserMedia()之后再更新label,如下图:
? 这种方案的优点就是在确定开会之前,选择设备时无需打开媒体设备;缺点是这种方案对Opera浏览器不太适用,这个第二点会介绍。
? b)在调用enumerateDevices()时先调用getUserMedia()弹出询问框,是否允许调用摄像头和麦克风,用户允许后部分浏览器(Opera、QQ)就能获取到label标签,但是搜狗和火狐label依旧为空,只能使用自定义的名字了。
? 这里调用getUserMedia()之前,我还调用了enumerateDevices()先判断当前到底有无媒体设备,据此决定getUserMedia()的配置,具体代码不方便贴,可以参考下面这篇博客:
? https://blog.csdn.net/qq3434569/article/details/106644112 -
其次,Opera如果不先获取媒体权限,用enumerateDevices()获取到的设备列表中,与实际设备数量不一致,我这里有两个同款摄像头,但是输出的设备列表中却只有一条数据
-
最后,火狐浏览器兼容性较差,即便获取了媒体权限之后,enumerateDevices()获取到的设备列表中也没有扬声器列表。