本文介绍 Web SDK 浏览器相关的已知问题和规避方案。

• Chrome 浏览器适配相关

  • 屏幕共享时提示 NotAllowedError Permission denied by system
  • Chrome 浏览器上屏幕共享黑屏
  • Chrome 浏览器接入，麦克风没有声音
  • Windows Chrome 111+ 浏览器屏幕共享可能出现鼠标重影、闪烁问题

• Safari 浏览器适配相关

  • Safari 浏览器，开启和关闭麦克风时，当前正在播放的声音会在扬声器和听筒间切换
  • Safari 浏览器，开启美颜时出现黑屏
  • Safari 浏览器，静音失效
  • iPhone 14 系列手机音频采集失败
  • iOS 13 和 14 版本视频编码异常
  • iOS 16 调用 SwitchDevice 后，本地画面卡在切换后的第一帧
  • Mac 设备的 Safari 16 + 版本浏览器中，屏幕共享失败

• Firefox 浏览器适配相关

  • Firefox 浏览器是否支持设置视频采集帧率

• Vue3 响应式及 Proxy 适配

Chrome 浏览器适配相关

屏幕共享时提示 NotAllowedError Permission denied by system

问题现象

在 Macbook 的 Chrome 浏览器上，开启共享屏幕，提示 NotAllowedError Permission denied by system。

问题解决

1. 单击苹果菜单，选择系统偏好设置> 安全性与隐私，单击 隐私 页签，在左侧导航栏中选择 屏幕录制。

2. 在屏幕录制授权列表中，取消选中 Google Chrome，再重新开启 Google Chrome 的屏幕录制授权。

3. 重启 Chrome 浏览器，使更改生效。

Chrome 浏览器上屏幕共享黑屏

问题现象

通过 Windows 操作系统的 Chrome 浏览器进行屏幕共享时，选择窗口进行共享微信、QQ、WPS 等应用时，出现采集区域黑屏。

问题解决

建议选择整个屏幕进行桌面共享。

Chrome 浏览器接入，麦克风没有声音

问题现象

通过 Windows 操作系统的Chrome 浏览器接入 NERTC，麦克风没有声音。

问题原因

Windows 操作系统的 Chrome 浏览器中会有一个 deviceId 为 communications 的麦克风设备，这个麦克风是 Chrome 基于真实麦克风做的一次封装，该麦克风会受 Windows 的声音通信配置受限。若用户将 Windows 的声音通信配置设置为 “将其他所有应用设置为静音”，并使用了 communications 麦克风采集，则可能出现 Chrome 被静音的问题。

问题解决

在指定麦克风设备进行声音采集时，请避免使用 deviceId 为 communications 的麦克风。

Windows Chrome 111+ 浏览器屏幕共享可能出现鼠标重影、闪烁问题

问题现象

在 Windows 平台上，使用 Chrome 111+ 版本浏览器进行屏幕共享时可能会出现鼠标重影和闪烁等问题。

问题解决

该问题已被列为 Chrome 的 bug，具体请参见 Chrome bug 1421656，暂无解决方式。需要等待 Chrome 进行修复。

Safari 浏览器适配相关

Safari 浏览器，开启和关闭麦克风时，当前正在播放的声音会在扬声器和听筒间切换

问题现象

iOS Safari 15 版本浏览器接入 NERTC，页面正在播放声音（例如播放背景音乐），NERTC 调用接口开启和关闭麦克风，当前正在播放的音频输出会在扬声器和听筒间切换，并且声音大小也会改变。

问题原因

NERTC SDK 调用 getUserMedia 获取麦克风权限，或通过 mictrack.stop() 关闭麦克风时，会影响页面上正在播放的 <audio> 标签，导致 <audio> 标签播放的声音会在扬声器和听筒间切换，并且声音大小也会改变。具体请参见 WebKit Bug 236439。

问题解决

iOS Safari 15 版本浏览器接入 NERTC 时，建议您使用 NERTC SDK 的伴音来播放背景音，而不是使用 <audio> 标签，具体请参见音效与伴音。

Safari 浏览器，开启美颜时出现黑屏

问题现象

使用 Safari 15 版本的浏览器接入 NERTC，开启美颜时出现黑屏。

问题原因

Safari 浏览器的 bug，具体请参见 WebKit Bug 230617。

问题解决

建议升级到 Safari 浏览器的最新版本。

Safari 浏览器，静音失效

问题现象

使用 iOS Safari 15.2 ~ 15.4 版本的浏览器接入 NERTC 时， 当页面正在播放的视频 <video> 处于静音状态时，NERTC 调用 getUserMedia 接口、open 或 init 接口，会导致静音失效。

问题原因

Safari 浏览器的 bug ，具体请参见 WebKit Bug 238456。

NERTC 的 open 和 init 接口内部封装了getUserMedia 接口。

问题解决

建议 Safari 浏览器升级到 15.5 及以上版本。

iPhone 14 系列手机音频采集失败

问题现象

iPhone 14 系列手机在 iOS 16 及以上版本的系统，Web 端操作关闭音频，再打开音频，会出现日志音频轨道已停止，主动关闭。

问题原因

iPhone 14 系列手机上 WebKit 的 bug，导致音频采集相关功能异常，具体请参见 WebKit Bug 246019。

问题解决

若您需要采集和发送本地音频，请使用 NERTC 的 muteAudio 和 unmuteAudio 接口，请勿使用 close()和 open() 接口。

iOS 13 和 14 版本视频编码异常

问题现象

iOS 13 和 14 版本，采集 720p 以上的视频会出现异常。

问题解决

iOS 13 和 14 版本的用户，调用 setVideoProfile 接口时，设置视频的分辨率不超过 720p；或升级到 iOS 15 及以上版本。

iOS 16 调用 SwitchDevice 后，本地画面卡在切换后的第一帧

问题现象

iOS 16 以上操作系统，调用 SwitchDevice 切换摄像头设备后，本地画面卡在切换后的第一帧。

问题原因

iOS 调整 MediaStream.tracks 后，HTMLMediaElement 元素进入可恢复的 pause 状态，需调用 dom.play() 进行恢复。

问题解决

如果您集成的是 NERTC V4.6.50 之前的版本，调用 SwitchDevice 后，需要调用 stream.resume()接口恢复播放视频。

Mac 设备的 Safari 16 + 版本浏览器中，屏幕共享失败

问题现象

某些 mac 设备使用 Safari 16+ 版本开启屏幕共享，出现报错： A MediaStreamTrack ended due to a capture failure。

问题解决

如果您集成的是 NERTC V4.6.50 及之前的版本，在 Safari 16 以上版本的浏览器中屏幕共享时，getDisplayMedia 中请不要填宽、高和分辨率。

Firefox 浏览器适配相关

Firefox 浏览器是否支持设置视频采集帧率

Firefox 浏览器不支持设置视频采集帧率，只能采集 30fps 的视频。一般来说，较高的帧率可以提供更流畅的视频画面，但不一定会影响视频质量。

如果您需要设置视频采集帧率，可以使用其他浏览器，例如 Chrome 或 Safari。

Vue3 响应式及 Proxy 适配

在使用 Vue3 时，怎么避免对 SDK 产生异常

Vue3 响应式基于 Proxy 实现。在使用 Vue3 时，请将 SDK 内部的实例（如 NERTC、Client、Stream 等）设置为不可被代理模式，以避免使用 Proxy 对 SDK 产生异常。具体请参见 Vue.js 官网文档的 markRaw() 方法。