快速开始
集成 SDK
导入 SDK
选择以下任一方式导入 Call Kit:
使用 NPM
使用 HTML Script Tag
初始化带有呼叫邀请功能的 Call Kit
初始化 Call Kit，并添加呼叫邀请插件:
- 生成一个Kit Token
- 在以下代码中填写所需参数
说明
-
以下示例代码展示了在客户端生成 Kit Token 的方法，可用于测试 Call Kit。但是，在您的 App 正式上线时，建议参考 使用 Kit Token 鉴权文档 在服务端生成 Kit Token，以避免安全风险。
-
UIKit 默认语言为英文，如需修改为中文，可以通过
setCallInvitationConfig接口设置language参数。
Untitled
// 调用方法生成一个Token。
// @param 1: appID
// @param 2: serverSecret
// @param 3: 房间ID
// @param 4: 用户ID
// @param 5: 用户名
const userID = "";
const userName = "userName" + userID;
const appID = 0;
const serverSecret = "";
const TOKEN = ZegoUIKitPrebuilt.generateKitTokenForTest(appID, serverSecret,null, userID, userName);
const zp = ZegoUIKitPrebuilt.create(TOKEN);
zp.addPlugins({ ZIM });
// 设置语言为中文
zp.setCallInvitationConfig({
...
language: ZegoUIKitLanguage.CHS,
...
})
1
设置按钮触发事件
设置一个按钮，并为呼叫邀请添加一个按钮点击事件。
您可以自定义上一步设置的按钮位置，并传入呼叫目标用户的 ID。
HTML
JS
<button onclick="invite()">invite</button>
1
function invite() {
const targetUser = {
userID:'',
userName:''
};
zp.sendCallInvitation({
callees: [targetUser],
callType: ZegoUIKitPrebuilt.InvitationTypeVideoCall,
timeout: 60,
}).then((res) => {
console.warn(res);
})
.catch((err) => {
console.warn(err);
});
}
1
运行和测试
至此，你已经完成了所有的步骤！
现在你可以使用你熟悉的服务器在浏览器中启动和运行项目。
资源
在线编程
点击这里在线编码并查看它的运行情况。
在线体验
点击这里尝试实时演示。
Related guides
自定义呼叫邀请用户界面
自定义呼叫邀请配置
自定义铃声
自定义事件回调