@tencentcloud/sdk-mcp 1.7.3 → 1.7.5

package/resource/knowledge/callkit/preset/ios/api.md

@@ -6,16 +6,16 @@ TUICallKit API 是音视频通话组件的**含 UI 接口**，使用TUICallKit A
 
 |API|描述|
 |---------|---------|
-|createInstance|创建 TUICallKit 实例（单例模式）。|
-|setSelfInfo|设置用户的昵称、头像。|
-|calls|发起单人或多人通话。|
-|join|主动加入通话。|
-|setCallingBell|设置自定义来电铃音。|
-|enableMuteMode|开启/关闭静音模式。|
-|enableFloatWindow|开启/关闭悬浮窗功能。|
-|enableIncomingBanner|开启/关闭来电横幅显示。|
+|[createInstance](#createInstance)|创建 TUICallKit 实例（单例模式）。|
+|[setSelfInfo](#setSelfInfo)|设置用户的昵称、头像。|
+|[calls](#calls)|发起单人或多人通话。|
+|[join](#join)|主动加入通话。|
+|[setCallingBell](#setCallingBell)|设置自定义来电铃音。|
+|[enableMuteMode](#enableMuteMode)|开启/关闭静音模式。|
+|[enableFloatWindow](#enableFloatWindow)|开启/关闭悬浮窗功能。|
+|[enableIncomingBanner](#enableIncomingBanner)|开启/关闭来电横幅显示。|
 |enableAITranscriber|开启/关闭 AI 实时转录与翻译。|
-|setScreenOrientation|设置屏幕方向。|
+|[setScreenOrientation](#77be322c-d1ea-411c-947d-2efeb260e3cc)|设置屏幕方向。|
 
 ## API 详情
 

package/resource/knowledge/callkit/preset/miniprogram/api-uniapp.md

@@ -0,0 +1,293 @@
+TUICallKit 是音视频通话组件的**含 UI 接口**，使用 TUICallKit API，您可以通过简单接口快速实现一个类微信的音视频通话场景；更详细的接入步骤，详见 [快速接入 TUICallKit](https://cloud.tencent.com/document/product/647/78733)。
+
+> **说明：**
+> - 为提供更优质的音视频通信能力，原 @trtc/call-uikit-wechat 包已正式停止维护，建议开发者迁移至 @trtc/calls-uikit-wx-uniapp、@trtc/calls-uikit-wx 新包。
+> - 新包对接口进行了优化调整，部分旧版接口不再兼容，同步提供更简洁、稳定的新接口方案。
+
+## API 概览
+
+|API|描述|
+|---------|---------|
+|<TUICallKit />|TUICallKit 通话 UI 组件。|
+|init|初始化 TUICallKit|
+|calls|发起单人或多人通话。|
+|join|主动加入通话。|
+|setSelfInfo|设置用户的头像、昵称。|
+|setCallingBell|设置自定义来电铃声。|
+|setLogLevel|设置日志级别。|
+|enableMuteMode|开启/关闭来电铃声。|
+|enableFloatWindow|开启/关闭悬浮窗功能。|
+|hideFeatureButton|隐藏按钮。|
+|setLocalViewBackgroundImage|设置本地用户通话界面背景图。|
+|setRemoteViewBackgroundImage|设置远端用户通话界面背景图。|
+|setLayoutMode|设置通话界面布局模式。|
+|setCameraDefaultState|设置摄像头是否默认打开。|
+|destroyed|销毁 TUICallKit。|
+|getTUICallEngineInstance|获取 TUICallEngine 实例。|
+
+## API 详情
+
+【uni-app 小程序】
+``` javascript
+import { TUICallKitAPI } from "@trtc/calls-uikit-wx-uniapp";
+```
+
+【微信小程序】
+``` javascript
+import { TUICallKitAPI } from "@trtc/calls-uikit-wx";
+```
+
+### init
+
+初始化 TUICallKit。
+``` javascript
+TUICallKitAPI.init({
+     sdkAppID: 0, // 替换为您自己账号下的 SDKAppId
+     userID: 'jane', // 填写当前用的 userID
+     userSig: 'xxxxxxxxxxxx',
+     tim: null, // 如果您不需要 TIM 实例，可忽略
+})
+```
+
+参数如下表所示：
+
+|参数|类型|说明|是否必填|
+|---------|---------|---------|---------|
+|sdkAppID|Number|您可以在**实时音视频控制台** > [应用管理](https://console.cloud.tencent.com/trtc/app) > **应用信息**中查看 SDKAppID。|是|
+|userID|String|当前用户的 ID，字符串类型，只允许包含英文字母（a-z 和 A-Z）、数字（0-9）、连词符（-）和下划线（_）。|是|
+|userSig|String|腾讯云设计的一种安全保护签名，获取方式请参见：[如何计算及使用 UserSig](https://cloud.tencent.com/document/product/647/17275)。|是|
+|tim|ChatSDK|TIM 实例。|否|
+
+这里详细介绍一下 init 中的几个参数：
+- **userSig**：使用步骤三中获取的 SecretKey 对 sdkAppID、userID 等信息进行加密，就可以得到 userSig，它是一个鉴权用的票据，用于腾讯云识别当前用户是否能够使用 TRTC 的服务，更多信息请参见 [如何计算及使用 UserSig](https://cloud.tencent.com/document/product/647/17275)。
+
+- **tim** 可以将外部的 tim 实例通过 init 透传给 callkit ，tim 参数适用于业务中已存在 TIM 实例，为保证 TIM 实例唯一性。
+
+### calls
+
+发起 1v1 或 多人通话。
+``` javascript
+TUICallKitAPI.calls({
+    userIDList: ["jane", "mike", "tommy"],
+    type: 1,
+})
+```
+
+参数如下表所示：
+| 参数 | 类型 | 含义 | 是否必填 |
+| --- | --- | --- | --- |
+| userIDList | Array<String> | 目标用户的 userId 列表，示例：["jane", "mike", "tommy"]。 | 是 |
+| type | CallMediaType | 通话的媒体类型，参数值说明参见 CallMediaType 通话类型。 | 是 |
+| chatGroupID | String | 与 chat 结合使用时， chat 群组的群 ID。 | 是 |
+| roomID | Number | 数字房间号，范围 [1, 2147483647]。 | 否 |
+| userData | String | 扩展字段：用于在邀请信令中增加扩展信息。 | 否 |
+| timeout | Number | - 通话的超时时间，0为不超时，单位 s(秒)（选填） 。设置范围：10s ~ 600s。如果传入0，默认30s。<br>- 被叫需要在30s 内处于登录状态，timeout 值才会有效，具体参见 timeout 字段设置无效。 | 否 |
+| offlinePushInfo | Object | 自定义离线消息推送（选填）。 | 否 |
+
+### join
+
+主动加入通话。
+``` javascript
+TUICallKitAPI.join({callId: xx});
+```
+
+参数如下表所示：
+
+|参数|类型|含义|是否必填|
+|---------|---------|---------|---------|
+|callId|String|此次通话的唯一 ID。|是|
+
+### setSelfInfo
+
+设置用户头像、昵称。
+
+> **注意：**
+> **通话中使用该接口修改用户信息，UI 不会立即更新，需要等到下次通话才能看到变化。**
+>
+
+``` javascript
+TUICallKitAPI.setSelfInfo({ nickName: "xxx", avatar: "http://xxx" });
+```
+
+参数如下表所示：
+
+|参数|类型|含义|
+|---------|---------|---------|
+|nickName|String|设置昵称。|
+|avatar|String|头像地址。|
+
+### setCallingBell
+
+设置自定义来电铃声。
+
+这里仅限传入本地文件地址，需要确保该文件目录是应用可以访问的。
+- 传入路径应为本地铃声文件的绝对地址。
+
+- 如需恢复默认铃声，`filePath` 传空即可。
+
+- 支持的铃声文件格式：
+
+   |格式|iOS|Android|
+   |---------|---------|---------|
+   |m4a|√|√|
+   |mp3|√|√|
+   |wav|√|√|
+   |aac|√|√|
+
+   ``` javascript
+   TUICallKitAPI.setCallingBell("filePath")
+   ```
+
+   参数如下表所示：
+
+   |参数|类型|含义|
+   |---------|---------|---------|
+   |filePath|String|铃声地址。|
+
+### setLogLevel
+
+设置日志级别，低于 level 的日志将不会输出。
+``` javascript
+TUICallKitAPI.setLogLevel(level)
+```
+
+参数如下表所示：
+| 参数 | 值 | 含义 |
+| --- | --- | --- |
+| level | 0 | 普通级别，日志量较多，接入时建议使用。 |
+| 1 | release 级别，SDK 输出关键信息，生产环境时建议使用。 |  |
+| 2 | 告警级别，SDK 只输出告警和错误级别的日志。 |  |
+| 3 | 错误级别，SDK 只输出错误级别的日志。 |  |
+| 4 | 无日志级别，SDK 将不打印任何日志。 |  |
+
+### enableMuteMode
+
+开启/关闭来电铃声。
+- 默认为 `false`，收到通话请求将播放来电铃声。
+
+- 若为 `true`，收到通话请求不会播放来电铃声。
+
+   ``` javascript
+   try {
+     await TUICallKitAPI.enableMuteMode(enable: boolean)
+   } catch (error: any) {
+     console.error(`[TUICallKit] Failed to call the enableMuteMode API. Reason: ${error}`);
+   }
+   ```
+
+### enableFloatWindow
+
+开启/关闭悬浮窗功能。默认为 false，通话界面左上角的悬浮窗按钮隐藏，设置为 true 后显示。
+``` javascript
+try {
+  await TUICallKitAPI.enableFloatWindow(enable: boolean)
+} catch (error: any) {
+  console.error(`[TUICallKit] Failed to call the enableFloatWindow API. Reason: ${error}`);
+}
+```
+
+### hideFeatureButton
+
+隐藏功能按钮，目前仅支持 摄像头，麦克风和切换前后置按钮。
+``` typescript
+TUICallKitAPI.hideFeatureButton(buttonName: FeatureButton);
+```
+
+参数列表：
+
+|参数|类型|是否必填|含义|
+|---------|---------|---------|---------|
+|buttonName|FeatureButton|是|按钮名称。|
+
+### setLocalViewBackgroundImage
+
+设置本地用户通话背景。
+``` typescript
+TUICallKitAPI.setLocalViewBackgroundImage(url: string);
+```
+
+参数列表：
+| 参数 | 类型 | 是否必填 | 含义 |
+| --- | --- | --- | --- |
+| url | String | 是 | 图片地址（支持本地路径和网络地址）。<br><strong>注意：</strong><br>如果使用网络地址，需要将网络地址添加到 request 合法域名。 |
+
+### setRemoteViewBackgroundImage
+
+设置远端用户通话背景。
+``` typescript
+TUICallKitAPI.setRemoteViewBackgroundImage(userId: string, url: string);
+```
+
+参数列表：
+| 参数 | 类型 | 是否必填 | 含义 |
+| --- | --- | --- | --- |
+| userId | String | 是 | 远端用户 userId，设置为 '*' 表示对所有远端用户生效。 |
+| url | String | 是 | 图片地址（支持本地路径和网络地址）。<br><strong>注意：</strong><br>如果使用网络地址，需要将网络地址添加到 request 合法域名。 |
+
+### setLayoutMode
+
+设置通话界面布局模式。
+``` javascript
+import { TUICallKitAPI, LayoutMode } from "../../TUICallKit/src/index";
+TUICallKitAPI.setLayoutMode(LayoutMode.LocalInLargeView);
+```
+
+参数列表：
+
+|参数|类型|是否必填|含义|
+|---------|---------|---------|---------|
+|layoutMode|LayoutMode|是|用户流的布局模式。|
+
+### setCameraDefaultState
+
+设置摄像头是否默认打开。
+``` javascript
+TUICallKitAPI.setCameraDefaultState(true);
+```
+
+参数列表：
+
+|参数|类型|是否必填|含义|
+|---------|---------|---------|---------|
+|isOpen|boolean|是|是否开启摄像头。|
+
+### destroyed
+
+销毁 TUICallKit。
+``` javascript
+TUICallKitAPI.destroyed()
+```
+
+### getTUICallEngineInstance
+
+获取 TUICallEngine 实例。
+``` javascript
+TUICallKitAPI.getTUICallEngineInstance();
+```
+
+## TUICallKit 类型定义
+
+### **offlinePushInfo**
+
+|参数|类型|是否必填|含义|
+|---------|---------|---------|---------|
+|offlinePushInfo.title|String|否|离线推送标题（选填）。|
+|offlinePushInfo.description|String|否|离线推送内容（选填）。|
+|offlinePushInfo.androidOPPOChannelID|String|否|离线推送设置 OPPO 手机 8.0 系统及以上的渠道 ID（选填）。|
+|offlinePushInfo.extension|String|否|离线推送透传内容（选填）（tsignaling 版本 ≥ 0.9.0）。|
+
+### FeatureButton
+
+|FeatureButton 类型|描述|
+|---------|---------|
+|FeatureButton.Camera|摄像头按钮。|
+|FeatureButton.Microphone|麦克风按钮。|
+|FeatureButton.SwitchCamera|切换前后置摄像头按钮。|
+|FeatureButton.InviteUser|邀请他人按钮。|
+
+### LayoutMode
+
+|LayoutMode 类型|描述|
+|---------|---------|
+|LayoutMode.LocalInLargeView|本地用户在大窗显示。|
+|LayoutMode.RemoteInLargeView|远端用户在大窗显示。|

package/resource/knowledge/callkit/preset/miniprogram/api.md

@@ -8,22 +8,22 @@ TUICallKit 是音视频通话组件的**含 UI 接口**，使用 TUICallKit API
 
 |API|描述|
 |---------|---------|
-|<TUICallKit />|TUICallKit 通话 UI 组件。|
-|init|初始化 TUICallKit|
-|calls|发起单人或多人通话。|
-|join|主动加入通话。|
-|setSelfInfo|设置用户的头像、昵称。|
-|setCallingBell|设置自定义来电铃声。|
-|setLogLevel|设置日志级别。|
-|enableMuteMode|开启/关闭来电铃声。|
-|enableFloatWindow|开启/关闭悬浮窗功能。|
-|hideFeatureButton|隐藏按钮。|
-|setLocalViewBackgroundImage|设置本地用户通话界面背景图。|
-|setRemoteViewBackgroundImage|设置远端用户通话界面背景图。|
-|setLayoutMode|设置通话界面布局模式。|
-|setCameraDefaultState|设置摄像头是否默认打开。|
-|destroyed|销毁 TUICallKit。|
-|getTUICallEngineInstance|获取 TUICallEngine 实例。|
+|[<TUICallKit />](#TUICallKit)|TUICallKit 通话 UI 组件。|
+|[init](#init)|初始化 TUICallKit|
+|[calls](#calls)|发起单人或多人通话。|
+|[join](#join)|主动加入通话。|
+|[setSelfInfo](#setSelfInfo)|设置用户的头像、昵称。|
+|[setCallingBell](#setCallingBell)|设置自定义来电铃声。|
+|[setLogLevel](#setLogLevel)|设置日志级别。|
+|[enableMuteMode](#enableMuteMode)|开启/关闭来电铃声。|
+|[enableFloatWindow](#enableFloatWindow)|开启/关闭悬浮窗功能。|
+|[hideFeatureButton](#hideFeatureButton)|隐藏按钮。|
+|[setLocalViewBackgroundImage](#setLocalViewBackgroundImage)|设置本地用户通话界面背景图。|
+|[setRemoteViewBackgroundImage](#setRemoteViewBackgroundImage)|设置远端用户通话界面背景图。|
+|[setLayoutMode](#setLayoutMode)|设置通话界面布局模式。|
+|[setCameraDefaultState](#setCameraDefaultState)|设置摄像头是否默认打开。|
+|[destroyed](#destroyed)|销毁 TUICallKit。|
+|[getTUICallEngineInstance](#getTUICallEngineInstance)|获取 TUICallEngine 实例。|
 
 ## API 详情
 
@@ -82,7 +82,7 @@ TUICallKitAPI.calls({
 | roomID | Number | 数字房间号，范围 [1, 2147483647]。 | 否 |
 | userData | String | 扩展字段：用于在邀请信令中增加扩展信息。 | 否 |
 | timeout | Number | - 通话的超时时间，0为不超时，单位 s(秒)（选填） 。设置范围：10s ~ 600s。如果传入0，默认30s。<br>- 被叫需要在30s 内处于登录状态，timeout 值才会有效，具体参见 timeout 字段设置无效。 | 否 |
-| offlinePushInfo | Object | 自定义离线消息推送（选填）。 | 否 |
+| <a href="#offlinePushInfo">offlinePushInfo</a> | Object | 自定义离线消息推送（选填）。 | 否 |
 
 ### join
 
@@ -197,7 +197,7 @@ TUICallKitAPI.hideFeatureButton(buttonName: FeatureButton);
 
 |参数|类型|是否必填|含义|
 |---------|---------|---------|---------|
-|buttonName|FeatureButton|是|按钮名称。|
+|buttonName|[FeatureButton](#FeatureButton)|是|按钮名称。|
 
 ### setLocalViewBackgroundImage
 
@@ -236,7 +236,7 @@ TUICallKitAPI.setLayoutMode(LayoutMode.LocalInLargeView);
 
 |参数|类型|是否必填|含义|
 |---------|---------|---------|---------|
-|layoutMode|LayoutMode|是|用户流的布局模式。|
+|layoutMode|[LayoutMode](#LayoutMode)|是|用户流的布局模式。|
 
 ### setCameraDefaultState
 

package/resource/knowledge/callkit/preset/miniprogram/integration.md

@@ -0,0 +1,292 @@
+
+## 小程序 Demo 体验
+- 如果您想要直接体验音视频通话小程序，[单击 Demo 体验](https://cloud.tencent.com/document/product/647/17021)，扫描小程序二维码。
+
+- 如果您想要直接跑通一个新工程，请直接阅读 [微信小程序 Demo 快速跑通](https://github.com/tencentyun/TUICallKit/tree/main/MiniProgram)。
+
+## 开发环境要求
+- 微信 App iOS 最低版本要求：7.0.9。
+
+- 微信 App Android 最低版本要求：7.0.8。
+
+- 小程序基础库最低版本要求：2.10.0。
+
+   > **警告：**
+   >
+   > - 由于小程序测试号不具备 <live-pusher> 和 <live-player> 的使用权限，请使用**企业小程序账号**申请相关权限进行开发。
+   > - 由于微信开发者工具不支持原生组件（即 <live-pusher> 和 <live-player> 标签），需要在**真机**上运行体验。
+   > - **不支持企业微信小程序**。
+
+## 小程序开发准备
+
+### 步骤1：开通企业类小程序
+
+### 步骤2：在小程序控制台开启实时音视频接口
+- 小程序推拉流标签使用权限暂时只开放给有限类目，[具体支持类目参见该地址](https://developers.weixin.qq.com/miniprogram/dev/component/live-pusher.html#%E7%94%B3%E8%AF%B7%E5%BC%80%E9%80%9A)。
+
+- 符合类目要求的小程序，需要在 [微信公众平台](https://mp.weixin.qq.com/) > **开发** > **开发管理** > **接口设置**中自助开通该组件权限。
+
+- 登录小程序控制台更新隐私保护政策，勾选**麦克风**、**摄像头**。
+
+### 步骤3：在小程序控制台配置域名
+
+在 [微信公众平台](https://mp.weixin.qq.com/) > **开发** > **开发管理** > **开发设置** > **服务器域名**中设置 **request 合法域名** 和 **socket 合法域名。**
+- 将以下域名添加到 **socket 合法域名**：
+
+| 域名 | 说明 | 是否必须 |
+| --- | --- | --- |
+| <code>wss://${SDKAppID}w4c.my-imcloud.com</code> | v3.4.6起，SDK 支持独立域名，可更好地保障服务稳定性。<br>例如您的 SDKAppID 是 1400xxxxxx，则独立域名为： <code>wss://1400xxxxxxw4c.my-imcloud.com</code> | 必须 |
+| <code>wss://wss.im.qcloud.com</code> | Web IM 业务域名 | 必须 |
+| <code>wss://wss.tim.qq.com</code> | Web IM 业务域名 | 必须 |
+| <code>wss://wssv6.im.qcloud.com</code> | Web IM 业务域名 | 必须 |
+
+- 将以下域名添加到 **request 合法域名**：
+
+   |域名|说明|是否必须|
+   |---------|---------|---------|
+   |`https://web.sdk.qcloud.com`|Web IM 业务域名|必须|
+   |`https://boce-cdn.my-imcloud.com`|Web IM 业务域名|必须|
+   |`https://api.im.qcloud.com`|Web IM 业务域名|必须|
+   |`https://events.im.qcloud.com`|Web IM 业务域名|必须|
+   |`https://webim.tim.qq.com`|Web IM 业务域名|必须|
+   |`https://wss.im.qcloud.com`|Web IM 业务域名|必须|
+   |`https://wss.tim.qq.com`|Web IM 业务域名|必须|
+
+- 将以下域名添加到 **uploadFile 合法域名**：
+
+| 域名 | 说明 | 是否必须 |
+| --- | --- | --- |
+| <code>https://${SDKAppID}-cn.rich.my-imcloud.com</code> | <strong>从 2024年9月10日起，新增应用默认分配 COS 独立域名。</strong><br>例如您的 SDKAppID 是 1400xxxxxx，则 COS 独立域名为：<code>https://1400xxxxxx-cn.rich.my-imcloud.com</code> | 必须 |
+| <code>https://cn.rich.my-imcloud.com</code> | 文件上传域名 | 必须 |
+| <code>https://cn.imrich.qcloud.com</code> | 文件上传域名 | 必须 |
+| <code>https://cos.ap-shanghai.myqcloud.com</code> | 文件上传域名 | 必须 |
+| <code>https://cos.ap-shanghai.tencentcos.cn</code> | 文件上传域名 | 必须 |
+| <code>https://cos.ap-guangzhou.myqcloud.com</code> | 文件上传域名 | 必须 |
+
+- 将以下域名添加到 **downloadFile 合法域名**：
+
+| 域名 | 说明 | 是否必须 |
+| --- | --- | --- |
+| <code>https://${SDKAppID}-cn.rich.my-imcloud.com</code> | <strong>从 2024年9月10日起，新增应用默认分配 COS 独立域名。</strong><br>例如您的 SDKAppID 是 1400xxxxxx，则 COS 独立域名为：<code>https://1400xxxxxx-cn.rich.my-imcloud.com</code> | 必须 |
+| <code>https://cn.rich.my-imcloud.com</code> | 文件下载域名 | 必须 |
+| <code>https://cn.imrich.qcloud.com</code> | 文件下载域名 | 必须 |
+| <code>https://cos.ap-shanghai.myqcloud.com</code> | 文件下载域名 | 必须 |
+| <code>https://cos.ap-shanghai.tencentcos.cn</code> | 文件下载域名 | 必须 |
+| <code>https://cos.ap-guangzhou.myqcloud.com</code> | 文件下载域名 | 必须 |
+
+## TUICallKit 源码集成
+
+### 步骤1：开通服务
+
+在使用腾讯云提供的音视频服务前，您需要前往控制台，为应用开通音视频服务。具体步骤。
+
+### 步骤2：创建小程序项目
+1. 在微信开发者工具上创建一个小程序项目，选择**不使用模板**。
+
+   ``` json
+   {
+     "pages": [
+       "pages/index/index"
+     ],
+     "window": {
+       "navigationBarTextStyle": "black",
+       "navigationStyle": "custom"
+     },
+     "style": "v2",
+     "renderer": "webview"
+   }
+   ```
+
+3. 新建终端。
+
+4. 执行 `npm init -y` 命令生成 `package.json`  文件。
+
+   ``` javascript
+   npm init -y
+   ```
+
+### 步骤3：下载并导入 TUICallKit 组件
+1. 下载 `TUICallKit` 组件。
+
+   ``` bash
+   npm i @trtc/calls-uikit-wx
+   ```
+
+【MacOS 端】
+``` bash
+mkdir -p ./TUICallKit && cp -r node_modules/@trtc/calls-uikit-wx/ ./TUICallKit
+```
+
+【Windows 端】
+``` bash
+xcopy node_modules\@trtc\calls-uikit-wx\ .\TUICallKit /i /e
+```
+
+2. 执行完以上命令后，您的目录下生成 `TUICallKit` 文件夹，其中包含有 `TUICallKit` 组件。目录如下：
+
+3. **构建 npm，**打开**微信开发者工具**单击**工具 > 构建 npm，新增 miniprogram_npm 目录。目录如下：**
+
+### 步骤4：填写 SDKAPPID 以及 SECRETKEY
+
+修改 `TUICallKit/debug/GenerateTestUserSig-es.js` 文件 的 `SDKAPPID` 以及 `SECRETKEY`。
+
+### 步骤5：调用 TUICallKit 组件
+1. 修改 `app.json` 文件，添加如下代码，新增全局监听页面。
+
+   ``` json
+   {
+     "pages": [
+       "pages/index/index",
+       "TUICallKit/pages/globalCall/globalCall"
+     ],
+     "window": {
+       "navigationBarTextStyle": "black",
+       "navigationStyle": "custom"
+     },
+     "style": "v2"
+   }
+   ```
+2. 修改 `pages/index` 文件夹下的文件。
+
+【index.wxml】
+``` javascript
+<view class="container">
+  <view class="box">
+    <view class="input-box">
+      <input type="text" maxlength="20" placeholder="{{isLogin?'请输入呼叫者userID':'请输入登录者userID' }}" value="{{userID}}" bindinput='bindInputUserID' placeholder-style="color:#BBBBBB;" />
+    </view>
+    <view class='login'>
+      <button class='loginBtn' bindtap="{{isLogin?'call':'login'}}">{{isLogin?'呼叫':'登录'}}</button>
+    </view>
+  </view>
+</view>
+```
+
+【index.js】
+``` javascript
+// 导入 TUICallKitAPI 模块，使您的应用具有全局呼叫的能力
+import { TUICallKitAPI } from "../../TUICallKit/TUICallService/index";
+// 导入 CallManager 模块，使您的应用具有全局监听来电的能力
+import { CallManager } from "../../TUICallKit/TUICallService/serve/callManager";
+import * as GenerateTestUserSig from "../../TUICallKit/debug/GenerateTestUserSig-es.js";
+wx.CallManager = new CallManager();
+Page({
+  data: {
+    userID: "",
+    isLogin: false,
+  },
+
+  bindInputUserID(e) {
+    this.setData({
+      userID: e.detail.value,
+    });
+  },
+
+  async login() {
+    const userID = this.data.userID;
+    if (!userID) return;
+    const { userSig, SDKAppID } = GenerateTestUserSig.genTestUserSig({
+      userID: userID,
+    });
+    await wx.CallManager.init({
+      sdkAppID: SDKAppID,
+      userID: userID,
+      userSig: userSig,
+      globalCallPagePath: "TUICallKit/pages/globalCall/globalCall",
+    });
+    wx.showToast({
+      title: "登录成功",
+      icon: "error",
+    });
+    this.setData({
+      isLogin: true,
+      userID: "",
+    });
+  },
+
+  async call() {
+    await TUICallKitAPI.calls({
+      userIDList: [this.data.userID],
+      type: 2,
+    });
+  },
+});
+```
+
+【index.wxss】
+``` css
+.container {
+  width: 100vw;
+  height: 100vh;
+}
+
+.box{
+  flex: 1;
+  width: 100vw;
+  margin-top: -40px;
+  background: #ffffff;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+}
+
+input{
+  display: flex;
+  font-size: 20px;
+  width: 60vw;
+}
+
+.login {
+  display: flex;
+  width: 100vw;
+  text-align: center;
+  bottom: 5vh;
+  margin: 70rpx;
+}
+.login button{
+  width: 80%;
+  background-color: #006eff;
+  border-radius: 50px;
+  color: white;
+}
+```
+
+### 步骤6：编译运行
+1. 请在本地设置里面勾选上“不校验合法域名、web-view (业务域名)、 TLS 版本以及 HTTPS 证书”。
+
+   > **警告：**
+   >
+   > **如果不勾选该条目，则会在控制台出现如下错误。**
+   >
+   >
+   >
+
+2. 单击**清缓存 > 全部清除，**避免开发者工具的缓存造成渲染异常。
+
+3. 编译小程序。
+
+4. 该项目快速集成后的预期效果图。
+
+### 步骤7：拨打您的第一通电话
+- 请单击预览，扫描二维码，在真机环境使用小程序。
+
+   > **注意：**
+   >
+   > 第一次使用小程序通话，需要获取摄像头和麦克风权限。
+   >
+
+## 更多特性
+
+### 开启悬浮窗功能
+
+> **注意：**
+> v4.2.10+ 支持。由于 [live-player](https://developers.weixin.qq.com/miniprogram/dev/component/live-player.html#%E5%B0%8F%E7%AA%97%E7%89%B9%E6%80%A7%E8%AF%B4%E6%98%8E) 限制，该功能仅在视频通话场景下支持。
+>
+
+您可以通过调用 enableFloatWindow 开启/关闭悬浮窗功能，在初始化 `TUICallKit` 组件时启用该功能，默认状态为关闭（`false`）。可通过点击通话界面左上角的悬浮窗按钮，将通话界面缩小为悬浮窗形式。
+
+调用 `enableFloatWindow(enable: boolean)` API 开启/关闭悬浮窗。
+``` javascript
+TUICallKitAPI.enableFloatWindow(true)
+```