Web 端相关

最近更新时间:2023-12-12 16:01:52

我的收藏

一、基础环境问题

Web 端 5.x 版本和 4.x 版本有什么区别?

TRTC Web SDK 5.x 版本是 Web 端全新升级版,提供扁平化接口、大幅简化 API、降低您的接入成本;在多人音视频场景下,具有更好的性能表现及弱网抗性。
如何选择使用哪个版本?
若您是新接入的客户,建议您使用 5.x 版本,以获得更好的支持。
若您已经接入了 4.x 版本,建议尽快升级到 5.x 版本(参考:升级指引)。4.x 版本会持续维护,但不再迭代新功能。

Web 端 SDK 支持哪些浏览器?

TRTC Web SDK 对浏览器的详细支持度,请参见 TRTC Web SDK 对浏览器支持情况。 对于上述没有列出的环境,您可以在当前浏览器打开 TRTC 能力测试 测试是否完整的支持 WebRTC 的功能。

通话前音视频设备测试?

如何实时检测当前网络的情况?

为什么本地开发测试能正常使用 TRTC Web SDK,但是部署到线上无法使用?

出于对用户安全、隐私等问题的考虑,浏览器限制网页只有在安全的环境下(例如 httpslocalhostfile:// 等协议),才能采集麦克风、摄像头。HTTP 协议是不安全的,浏览器会禁止在 HTTP 协议下采集媒体设备。
若您在本地开发测试一切正常,但是页面部署后,却无法正常采集摄像头、麦克风。则请检查您的网页是否部署到了 HTTP 协议上,若是,请使用 HTTPS 部署您的网页,并确保具备合格的 HTTPS 安全证书。
更多详情请参见 URL域名及协议限制说明

是否支持大小流、水印?

详情请参见 大小流水印 文档实现高级功能。

WebRTC 有哪些已知问题?

二、推拉流问题

Web 端 SDK 日志中报错 NotFoundError、NotAllowedError、NotReadableError、OverConstrainedError 以及 AbortError 分别是什么意思?

这是设备采集失败时的错误,详情请参考:DEVICE_ERROR

部分手机上的浏览器无法正常运行 TRTC 进行推拉流?

TRTC Web SDK 对浏览器的详细支持度,请参见 TRTC Web SDK 对浏览器支持情况。 对于上述没有列出的环境,您可以在当前浏览器打开 TRTC 能力测试 测试是否完整的支持 WebRTC 的功能。

Web 端用宽高设置推流的分辨率是所有浏览器都适用吗?

由于设备和浏览器的限制,视频分辨率不一定能够完全匹配,在这种情况下,浏览器会自动调整分辨率使其接近 Profile 对应的分辨率。详情请参见 trtc.startLocalVideo 的 profile 参数

Web 端支持哪些视频画面分辨率设置?

目前 Web 端支持设置 720p、1080p、2k 和 4k 的视频画面分辨率,更多设置详情请见Web端画面质量设置

Web 端屏幕分享的样式支持修改吗?

屏幕分享的样式由浏览器控制,目前不能修改。

Web 端 SDK 在使用的过程中拔掉摄像头,怎么清除摄像头列表里面的数据?

监听 DEVICE_CHANGED 事件,SDK 会在设备插拔时触发该事件,此时重新获取一次摄像头列表即可。

iOS 的微信内嵌浏览器不能正常推流?

iOS 14.3+ 版本的微信内嵌浏览器,可以正常推流。
请参见 浏览器支持情况,查看 iOS 上的微信内嵌浏览器对推拉流的支持情况。

三、播放问题

通话过程中出现有画面但是听不到声音?

因浏览器自动播放策略限制,在用户没有与页面产生交互的情况下,音频播放可能会被浏览器拦截,请参见 自动播放受限处理建议
其他异常,可通过监控仪表盘查询收发两端的音量值进行排查。

四、其他

2.x、3.x版本的 SDK,在 Chrome 96+ 版本无法正常通话该如何处理?

最新版本的 Chrome 96 废弃了 Plan-B,将会导致 TRTC 实时音视频老版本的(2.x, 3.x) Web SDK 会出现无法通话的情况,请您尽快将 Web SDK 升级至我们的最新版本(5.x)。5.x 版本 SDK 的接口与老版本(2.x, 3.x)不兼容,请参考 快速集成(Web) 升级接入 5.x 版本 SDK。

通话一直没办法互通,切换网络后就正常了?

一般是由于网络防火墙导致,请检查防火墙配置。具体请参见 应对防火墙限制相关 进行处理。

Web 端 SDK 可以获取当前音量大小吗?

可以通过 AUDIO_VOLUME 事件 获取当前音量大小,具体请参见 音量大小检测

什么情况会收到 KICKED_OUT 事件?

当用户被移出时会触发该事件,例如:使用同名用户同时登录、调用后台 RESTAPI 移除用户将用户移出房间、调用后台 RESTAPI 解散房间
注意:
同名用户同时登录是不允许的行为,可能会导致双方通话异常,业务层应避免出现同名用户同时登录。

Web 端是否可以监听远端离开房间?

支持监听远端退房事件,建议使用客户端事件中的 REMOTE_USER_EXIT 事件实现远端用户退房通知。

TRTC 的 Web 端、小程序端、PC 端是不是互通的?

是的,实时音视频支持全平台互通。

收到 trtc.on('error') 事件该如何处理?

这个表示 SDK 遇到不可恢复错误,在 SDK 经过多次重试后仍然无法恢复时,会抛出该事件。此时可以通过重新进房或者刷新页面来恢复。

Web 端如何在屏幕分享的时候采集系统声音?

具体操作请参见 实现屏幕分享

Web 端如何切换摄像头和麦克风?

在 iframe 使用 TRTC Web SDK 报错 Permission denied?

在 iframe 中使用 WebRTC 需要给 iframe 标签增加属性来开启相关权限,具体参考如下。 麦克风、摄像头、屏幕分享权限:
<iframe allow="microphone; camera; display-capture;">

在微信 H5 无法采集摄像头和麦克风?

出现这种情况,可能是您的微信清理了数据、或者是首次安装的微信,这种情况下微信使用安装时自带的浏览器内核是不支持设备采集的。 微信会在 Wi-Fi 联网的情况下,自动下载安装支持设备采集的 XWeb 内核。您可以在 Wi-Fi 联网一段时间(例如半小时)后再次重试。

使用 Vue 3 有哪些注意事项?

在 Vue3 框架使用时,需要注意使用 markRaw 接口标记 trtc 实例,避免 Vue 将 trtc 实例转成 Proxy 对象,导致不可预知的问题。
import { markRaw } from 'vue';
const trtc = markRaw(TRTC.create());