GroupCall

This article introduces the use of the group call feature, such as initiating a group call and joining a group call.

Expected outcome

TUICallKit supports group calls. The expected outcome is shown in the figure below.
Web
Mobile Client







Create groupID

Before using the group call feature, you need to create a group first and initiate a group call in an existing group.
Method one: Create a group by calling the Chat API, see Chat Group Management for details.
Method two: Manually create a group through the console, see Console group management for details.
import Chat from "@tencentcloud/chat"; // npm i @tencentcloud/chat

const userIDList: string[] = ['user1', 'user2'];
async function createGroupID() {
const chat = Chat.create({ SDKAppID });
const memberList: any[] = userIDList.map(userId => ({ userID: userId }));
const res = await chat.createGroup({
type: Chat.TYPES.GRP_PUBLIC, // Must be a public group
name: 'WebSDK',
memberList
});
return res.data.group.groupID;
}

Group call

Initiate a group call

Initiate a group call by calling the groupCall API.
import { TUICallKitServer, TUICallType } from "@tencentcloud/call-uikit-react";
// Replace it with the call-uikit npm package you are currently using

try {
const params = {
userIDList: ['user1', 'user2'],
groupID: 'xxx',
type: TUICallType.VIDEO_CALL,
}
await TUICallKitServer.groupCall(params);
} catch (error: any) {
console.error(`[TUICallKit] groupCall failed. Reason:${error}`);
}

Join a group call

Join an existing audio and video call in the group by calling the joinInGroupCall API.
Note:
v3.1.2+ is supported.
import { TUICallKitServer, TUICallType } from "@tencentcloud/call-uikit-react";
// Replace it with the call-uikit npm package you are currently using

try {
const params = {
type: TUICallType.VIDEO_CALL,
groupID: "xxx",
roomID: 0,
};
await TUICallKitServer.joinInGroupCall(params);
} catch (error: any) {
console.error(`[TUICallKit] joinInGroupCall failed. Reason: ${error}`);
}