TUIKit 组件从 1.0.9 版本开始支持单人/多人音视频通话功能,并且实现了小程序、Web 和 Native 平台的互通。
说明
2022年8月以后,TUIKit 组件升级了音视频通话功能,采用了全新的 TUICallKit,新版本音视频通话功能需要加购专属的 IM 音视频通话能力包后解锁,具体购买方法请参见 步骤3:开通音视频服务,如已开通,则可忽略该步骤。
音视频通话界面如下图所示:
语音通话 | 视频通话 |
![]() | ![]() |
操作步骤
步骤1:开通小程序权限
由于 TUICallKit 所使用的小程序标签有更苛刻的权限要求,因此集成 TUICallKit 的第一步就是要开通小程序的类目和标签使用权限,否则无法使用,这包括如下步骤:
小程序推拉流标签不支持个人小程序,只支持企业类小程序。需要在 注册 时填写主体类型为企业,如下图所示:


小程序推拉流标签使用权限暂时只开放给有限 类目。
符合类目要求的小程序,需要在 微信公众平台 > 开发 > 开发管理 > 接口设置中自助开通该组件权限,如下图所示:


步骤2:在小程序控制台配置域名
request 合法域名:
https://official.opensso.tencent-cloud.comhttps://yun.tim.qq.comhttps://cloud.tencent.comhttps://webim.tim.qq.comhttps://query.tencent-cloud.comhttps://web.sdk.qcloud.com
socket 合法域名:
wss://wss.im.qcloud.comwss://wss.tim.qq.com


步骤3:开通音视频通话能力
1. 登录 即时通信 IM 控制台 ,单击目标应用卡片,进入应用的基础配置页面。
2. 在页面的右下角找到开通腾讯实时音视频服务功能区。
2.1 若您需要体验音视频通话功能,可单击卡片内的 免费体验 开通 TUICallKit 的 7 天免费试用服务。


2.2 您可参见 音视频通话能力版本说明 确认所需要使用的版本,单击 购买正式版 以购买正式的音视频通话能力。在购买页内的增值服务中勾选“音视频通话能力”,并选择所需版本即可。



步骤4:下载 TUICallKit 组件
通过 npm 方式下载 TUICallKit 组件,为了方便您后续的拓展,建议您将 TUICallKit 组件复制到自己项目的 TUIKit/components/TUICallKit 目录下:
注意
npm i @tencentcloud/call-uikit-wechat
macOS 端
cp -r node_modules/@tencentcloud/call-uikit-wechat/ ./TUIKit/components/TUICallKit
windows 端
xcopy node_modules\\@tencentcloud\\call-uikit-wechat .\\TUIKit\\components\\TUICallKit /i /e
成功后目录结构如图所示:
微信开发者工具-工具-选择构建 npm:
构建 npm 后目录如下(新增 miniprogram_npm 文件夹):
说明
您构建 npm 时,若出现如下图所示提示,请单击确定,该提示信息不会影响到组件的正常使用。
npm i @tencentcloud/call-uikit-wechat
macOS 端
cp -r node_modules/@tencentcloud/call-uikit-wechat/ ./TUIKit/components/TUICallKit
windows 端
xcopy node_modules\\@tencentcloud\\call-uikit-wechat .\\TUIKit\\components\\TUICallKit /i /e
成功后目录结构如图所示:
步骤5:进行您的第一次通话
常见问题
错误提示“The package you purchased does not support this ability”?
如何购买套餐?
通话邀请的超时时间默认是多久?
通话邀请的默认超时时间是30s。
相关文档
交流与反馈
欢迎加入 QQ 群进行技术交流和反馈问题。