最佳实践 | 基于TRTCCalling快速实现多人音视频通话

TRTCCalling SDK 基于TRTC和TSignaling ，封装了简单易用的 API，接入后可快速实现web和native互通的1v1或群实时通话。

效果展示

群视频通话

语音通话

在线体验

https://web.sdk.qcloud.com/im/demo/latest/index.html

1）注册登录后，创建一个 IM 的群组，拉上其他人入群，打开会话窗口，点击实时音视频选择（语音通话或者视频通话）。

2）选择呼叫用户列表，单击【确定】，就可以发起实时通话了。

3）呼叫界面

4）通话界面

视频通话

语音通话

使用 TRTCCalling 实现1v1和群实时通话

步骤1：注册即时通信 IM 应用，开通 TRTC服务

登录 即时通信 IM 控制台 ，单击目标应用卡片，进入应用的基础配置页面。

单击【开通腾讯实时音视频服务】区域的【立即开通】。

在弹出的开通实时音视频 TRTC 服务对话框中，单击【确认】。系统将为您在 实时音视频控制台 创建一个与当前 IM 应用相同 SDKAppID 的实时音视频应用，二者帐号与鉴权可复用。

步骤2：接入SDK，初始化实例

• 在项目中通过 npm 安装最新版本的 tim-js-sdk、tsignaling、trtc-calling-js。如果项目已经集成有 tim-js-sdk 或 trtc-calling-js，直接将其升级到最新版本即可。

• 在项目中引入 TRTCCalling

• 如果需要通过script标签外链的方式引入，需要将tim-js.js、tsignaling.js、trtc-calling-js.js拷贝至项目中，按顺序引入。

步骤3: 注册监听函数并登录

步骤4：发起发起1v1或多人通话

步骤5：接受、拒绝、挂断

SDK 事件详解

TRTCCalling.EVENT.INVITED

• 被邀请者收到语音/视频邀请时会触发

TRTCCalling.EVENT.USER_ENTER

• 被邀请者同意进入通话

TRTCCalling.EVENT.USER_LEAVE

• 用户离开通话

TRTCCalling.EVENT.REJECT

• 被邀请者拒绝通话

TRTCCalling.EVENT.LINE_BUSY

• 被邀请者忙线

TRTCCalling.EVENT.CALLING_TIMEOUT

• 本次通话超时未应答

TRTCCalling.EVENT.NO_RESP

• 被邀请用户无应答

TRTCCalling.EVENT.CALLING_END

• 收到该回调说明本次通话结束了

TRTCCalling.EVENT.USER_VIDEO_AVAILABLE

• 远端用户开启/关闭了摄像头, 会收到该回调

TRTCCalling.EVENT.USER_AUDIO_AVAILABLE

• 远端用户开启/关闭了麦克风, 会收到该回调

为了开发者可以快速接入，我们在 TRTCCalling SDK 的基础上，提供了同时支持单聊、群语音视频通话组件 Demo，并开源到了 github。开发者 fork&clone 项目到本地，稍作修改即可把 Demo 跑起来体验，或者将组件集成到自己的项目部署上线。

注意事项

• 监听事件必须在index文件 ，避免被呼叫方漏掉 SDK 派发的事件。
• 在邀请超时时间内，被邀请者如果离线再上线，不能收到邀请， 目前 Web 仅支持在线情况。

参考资料：

TRTCCalling 接口手册

https://web.sdk.qcloud.com/component/trtccalling/doc/web/zh-cn/TRTCCalling.html

实时视频通话(桌面浏览器)

https://cloud.tencent.com/document/product/647/49789

TSignaling 接口手册

https://web.sdk.qcloud.com/component/tsignaling/doc/zh-cn/TSignaling.html

腾讯云即时通信 IM 在线 Demo 地址:

https://web.sdk.qcloud.com/im/demo/latest/index.html

腾讯云即时通信 IM 在线 Demo 开源地址github

https://github.com/tencentyun/TIMSDK