API 简介
TUIRoomKit API 是多人视频会议组件的含 UI 接口，使用 TUIRoomKit API，您可以通过简单接口快速实现一个类微信的音视频通话场景。如果您想要体验并调试视频会议效果，请阅读 Demo 快速跑通。如果您想把我们的功能直接嵌入到您的项目中，请阅读 快速接入（uni-app (客户端））。
API 概览
在页面中引用 TUIRoomKit 组件。例如：在
room.vue 组件中引入 TUIRoomKit 组件。TUIRoomKit 组件将用户分为主持人角色及普通成员角色。组件对外提供了 init、createRoom、enterRoom 方法。
主持人及普通成员可通过 init 方法向 TUIRoomKit 组件初始化应用及用户数据，主持人可通过 createRoom 方法创建并加入房间，普通成员可通过 enterRoom 方法加入主持人已经创建好的房间。
<template><room ref="TUIRoomRef"></room></template><script setup lang="ts">import { ref, onMounted } from 'vue';// 引入 TUIRoom 组件，注意确认引入路径是否正确import Room from './TUIRoom/index.vue';// 获取 TUIRoom 组件元素，用于调用 TUIRoom 组件的方法const TUIRoomRef = ref();onMounted(async () => {// 初始化 TUIRoom 组件// 主持人在创建房间前需要先初始化 TUIRoom 组件// 普通成员在进入房间前需要先初始化 TUIRoom 组件await TUIRoomRef.value.init({// 获取 sdkAppId 请您参考 步骤一sdkAppId: 0,// 用户在您业务中的唯一标示 IduserId: '',// 本地开发调试可在 https://console.cloud.tencent.com/trtc/usersigtool 页面快速生成 userSig, 注意 userSig 与 userId 为一一对应关系userSig: '',// 用户在您业务中使用的昵称userName: '',// 用户在您业务中使用的头像链接avatarUrl: '',// 用户在您业务中需要的皮肤主题颜色及是否支持切换皮肤主题theme: {defaultTheme:'black',isSupportSwitchTheme: true}})// 默认执行创建房间，实际接入可按需求择机执行 handleCreateRoom 方法await handleCreateRoom();})// 主持人创建房间，该方法只在创建房间时调用async function handleCreateRoom() {// roomId 为用户进入的房间号, 要求 roomId 类型为 string// roomMode 包含'FreeToSpeak'(自由发言模式) 和'SpeakAfterTakingSeat'(上台发言模式) 两种模式，默认为'FreeToSpeak'，注意目前仅支持自由发言模式// roomParam 指定了用户进入房间的默认行为（是否默认开启麦克风，是否默认开启摄像头，默认媒体设备Id)const roomId = '123456';const roomMode = 'FreeToSpeak';const roomParam = {isOpenCamera: true,isOpenMicrophone: true,}try {await TUIRoomRef.value.createRoom({ roomId, roomName: roomId, roomMode, roomParam });} catch (error: any) {alert('TUIRoomKit.createRoom error: ' + error.message);}}// 普通成员进入房间，该方法在普通成员进入已创建好的房间时调用async function handleEnterRoom() {// roomId 为用户进入的房间号, 要求 roomId 类型为 string// roomParam 指定了用户进入房间的默认行为（是否默认开启麦克风，是否默认开启摄像头，默认媒体设备Id)const roomId = '123456';const roomParam = {isOpenCamera: true,isOpenMicrophone: true,}try {await TUIRoomRef.value.enterRoom({ roomId, roomParam });} catch (error: any) {alert('TUIRoomKit.enterRoom error: ' + error.message);}}</script><style>page {width: 100%;height: 100%;}</style>
API 详情
TUIRoomkit 接口
init
初始化 TUIRoomKit 数据，任何使用 TUIRoomKIt 的用户都需要调用 init 方法。
TUIRoomRef.value.init(roomData);
参数如下表所示：
参数 | 类型 | 含义 |
roomData | object | 房间初始化参数 |
roomData.sdkAppId | number | 客户的 SDKAppId |
roomData.userId | string | 用户的唯一 ID |
roomData.userSig | string | 用户的 UserSig |
roomData.userName | string | 用户的昵称 |
roomData.avatarUrl | string | 用户的头像地址 |
roomData.theme | object | 界面的主题风格 |
roomData.theme.defaultTheme | string | 默认主题皮肤颜色 |
roomData.theme.isSupportSwitchTheme | boolean | 是否支持切换主题 |
createRoom
主持人创建房间。
TUIRoomRef.value.createRoom(roomId, roomMode, roomParam);
参数如下表所示：
参数 | 类型 | 含义 |
roomId | string | 房间 ID |
roomMode | string | 房间模式，FreeToSpeak（自由发言模式）和 SpeakAfterTakingSeat（上台发言模式），默认为 FreeToSpeak |
roomParam | object | 非必填 |
roomParam.isOpenCamera | string | 非必填，进房是否打开摄像头，默认为关闭 |
roomParam.isOpenMicrophone | string | 非必填，进房是否打开麦克风，默认为关闭 |
enterRoom
普通成员加入房间。
TUIRoomRef.value.enterRoom(roomId, roomParam);
参数如下表所示：
参数 | 类型 | 含义 |
roomId | string | 房间 ID |
roomParam | object | 非必填 |
roomParam.isOpenCamera | string | 非必填，进房是否打开摄像头，默认为关闭 |
roomParam.isOpenMicrophone | string | 非必填，进房是否打开麦克风，默认为关闭 |
TUIRoomkit 事件
onCreateRoom
创建房间回调。
<template><room ref="TUIRoomRef" @on-create-room="onCreateRoom"></room></template><script setup lang="ts">// 引入 TUIRoom 组件，注意确认引入路径是否正确import Room from './TUIRoom/index.vue';function onCreateRoom(info) {if (info.code === 0) {console.log('创建房间成功')}}</script>
onEnterRoom
进入房间回调。
<template><room ref="TUIRoomRef" @on-enter-room="onEnterRoom"></room></template><script setup lang="ts">// 引入 TUIRoom 组件，注意确认引入路径是否正确import Room from './TUIRoom/index.vue';function onEnterRoom(info) {if (info.code === 0) {console.log('进入房间成功')}}</script>
onDestroyRoom
主持人销毁房间的回调。
<template><room ref="TUIRoomRef" @on-destroy-room="onDestroyRoom"></room></template><script setup lang="ts">// 引入 TUIRoom 组件，注意确认引入路径是否正确import Room from './TUIRoom/index.vue';function onDestroyRoom(info) {if (info.code === 0) {console.log('主持人销毁成功')}}</script>
onExitRoom
普通成员退出房间的回调。
<template><room ref="TUIRoomRef" @on-exit-room="onExitRoom"></room></template><script setup lang="ts">// 引入 TUIRoom 组件，注意确认引入路径是否正确import Room from './TUIRoom/index.vue';function onExitRoom(info) {if (info.code === 0) {console.log('普通成员退出房间成功')}}</script>
onKickedOutOfRoom
普通成员被主持人踢出房间通知。
<template><room ref="TUIRoomRef" @on-kicked-out-of-room="onKickedOutOfRoom"></room></template><script setup lang="ts">// 引入 TUIRoom 组件，注意确认引入路径是否正确import Room from './TUIRoom/index.vue';function onKickedOutOfRoom({ roomId, message }) {console.log('普通成员被主持人踢出房间', roomId, message);}</script>
onKickedOffLine
用户账号在其他地方登录，被踢下线。
<template><room ref="TUIRoomRef" @on-kick-off-line="onKickedOffLine"></room></template><script setup lang="ts">// 引入 TUIRoom 组件，注意确认引入路径是否正确import Room from './TUIRoom/index.vue';function onKickedOffLine({ message }) {console.log('成员被踢下线', message)；}</script>
onUserSigExpired
用户 userSig 过期，请重新获取 userSig。
<template><room ref="TUIRoomRef" @on-user-sig-expired="onUserSigExpired"></room></template><script setup lang="ts">// 引入 TUIRoom 组件，注意确认引入路径是否正确import Room from './TUIRoom/index.vue';function onUserSigExpired() {console.log('用户 userSig 过期, 请重新生成 userSig.')；}</script>
