npm - @tencentcloud/sdk-mcp - Versions diffs - 1.4.7 → 1.6.0-beta.1 - Mend

@tencentcloud/sdk-mcp 1.4.7 → 1.6.0-beta.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (556) hide show

package/resource/{doc → integration}/livekit/preset/live/vue/live-player-h5-integration.md RENAMED Viewed

@@ -1,5 +1,11 @@
 本文对 TUILiveKit Demo 中的**观看页面**进行了详细的介绍，您可以在已有项目中直接参考本文档集成我们开发好的观看页面，也可以根据您的需求按照文档中的内容对页面的样式，布局以及功能项进行深度的定制。
+> **集成提示****：**
+>
+> 本文档介绍基于 **UI 组件** 的观众观看方式（含完整交互 UI）。若您需通过 **Core SDK** 自行搭建观众端界面，请参考 观众观看 (Core SDK)。
+>
 ## 功能展示
 观看页面提供默认行为和风格，但如果默认行为和样式不能完全满足您的需求，您也可以对 UI 进行自定义。图中显示的数字与特定功能列表中的类别相对应。其中主要包含直播**信息展示、视频直播区域、在线观众、音视频操作、直播时长、画面分辨率切换、全屏功能、聊天互动、消息列表等。**
@@ -150,7 +156,7 @@ npm run dev
 ### 步骤1：开启一场直播
 - **方式一（推荐）：**
-   使用我们提供的 [在线开播网站](https://web.sdk.qcloud.com/trtc/livekit/pusher/index.html#/?fromMark=123471)，开启一场直播来观看，开启后获取直播间 ID
+   使用我们提供的 [在线开播网站](https://web.sdk.qcloud.com/trtc/livekit/pusher/index.html#/)，开启一场直播来观看，开启后获取直播间 ID
 - **方式二：**
@@ -235,15 +241,15 @@ import { UIKitProvider } from '@tencentcloud/uikit-base-component-vue3';
 ### 按钮 Button 和图标 Icon
-若您需要对按钮 Button 或图标 Icon 等其他控件进行新增或替换等 UI 定制，您可以通过如下方式实现，以`live-player.vue `文件中的按钮和图标为例，您可以参考下图找到对应按钮或图标的指定位置源码，对当前部分的控件进行**增加、删除、替换**等 UI 定制操作。
+若您需要对按钮 Button 或图标 Icon 等其他控件进行新增或替换等 UI 定制，您可以通过如下方式实现，以 `live-player.vue` 文件中的按钮和图标为例，您可以参考下图找到对应按钮或图标的指定位置源码，对当前部分的控件进行**增加、删除、替换**等 UI 定制操作。
 根据上述示例，我们同样支持您根据项目需求对**观众观看页面**进行 UI 定制的能力。除了页面 UI 布局调整，我们也支持您对**颜色主题、字体、圆角、按钮、图标、输入框、弹框等**内容进行**增加、删除、修改**等操作，满足您的 UI 定制需要。
-| **类别** | **功能** | **描述** |
+| <strong>类别</strong> | <strong>功能</strong> | <strong>描述</strong> |
 | --- | --- | --- |
-| **素材管理** | 自定义素材管理区域展示 | 支持调整 Icon 的大小、颜色或对 Icon 进行替换。 |
-| **直播工具** | 自定义直播工具信息展示 | 支持调整 Icon 的大小、颜色或对 Icon 进行替换。 |
-| **在线观众** | 自定义观众信息展示 | **支持：**<br>- 展示/隐藏观众等级。<br>- 观众信息字体、颜色 UI 自定义设置。<br>- 替换为您需要的 Icon 风格。 |
-| **消息列表** | 自定义消息弹幕区域展示 | **支持：**<br>- 展示/隐藏聊天输入区域。<br>- 支持 UI 定制聊天气泡风格、定制观众等级等内容。 |
+| <strong>素材管理</strong> | 自定义素材管理区域展示 | 支持调整 Icon 的大小、颜色或对 Icon 进行替换。 |
+| <strong>直播工具</strong> | 自定义直播工具信息展示 | 支持调整 Icon 的大小、颜色或对 Icon 进行替换。 |
+| <strong>在线观众</strong> | 自定义观众信息展示 | <strong>支持：</strong><br>- 展示/隐藏观众等级。<br>- 观众信息字体、颜色 UI 自定义设置。<br>- 替换为您需要的 Icon 风格。 |
+| <strong>消息列表</strong> | 自定义消息弹幕区域展示 | <strong>支持：</strong><br>- 展示/隐藏聊天输入区域。<br>- 支持 UI 定制聊天气泡风格、定制观众等级等内容。 |
 ## 常见问题
@@ -300,8 +306,8 @@ export { useCustomizedAutoPlayDialog };
 ## 下一步
 恭喜您，现在您已经成功集成了观众观看。接下来，您可以继续接入 **直播列表、UI 自定义**和**监播**等功能：
-| **功能** | **描述** | **集成指引** |
+| <strong>功能</strong> | <strong>描述</strong> | <strong>集成指引</strong> |
 | --- | --- | --- |
 | 直播列表 | 展示直播列表界面和功能，包含直播列表和房间信息展示功能。 | 直播列表（Web Vue3） |
 | UI 自定义 | 更详细的 UI 组件自定义指引。 | 概述 |
-| Web 监播 | 运营平台，支持直播间管控。 | Web 监播页（Web Vue3） |
+| 直播管理系统 | 运营平台，支持直播间管控。 | 直播管理系统（Vue3） |

package/resource/{doc → integration}/livekit/preset/live/vue/live-pusher-integration.md RENAMED Viewed

@@ -1,5 +1,11 @@
 本文将介绍如何接入 TUILiveKit Demo 的**主播开播页**，指导您将我们提供的开播页面集成到您的项目中，同时介绍如何对直播页面的样式、布局、以及功能进行自定义修改。
+> **集成提示****：**
+>
+> 本文档介绍基于 **UI 组件** 的开播方式（含完整交互 UI）。若您需通过 **Core SDK** 自行搭建主播端界面，请参考 主播开播 (Core SDK)。
+>
 ## 功能展示
 - **横屏开播**
@@ -195,7 +201,7 @@ onMounted(async () => {
 ### 步骤5：观看直播
 - **方式一：（推荐）**
-   通过我们提供的 [在线观看网站](https://web.sdk.qcloud.com/trtc/livekit/player/index.html#/?fromMark=123470)，立刻观看您开启的直播。
+   通过我们提供的 [在线观看网站](https://web.sdk.qcloud.com/trtc/livekit/player/index.html#/)，立刻观看您开启的直播。
 - **方式二：**
@@ -217,7 +223,7 @@ onMounted(async () => {
 【支持媒体设置能力】
-若您需要支持媒体设置能力，包括设置扬声器、麦克风音量大小等内容，请参考如下代码示例复制到`live-pusher.vue `文件中即可。
+若您需要支持媒体设置能力，包括设置扬声器、麦克风音量大小等内容，请参考如下代码示例复制到 `live-pusher.vue` 文件中即可。
 ``` typescript
 <!-- MediaDeviceSetting 媒体设备设置 -->
 <template>
@@ -302,7 +308,7 @@ watch(outputVolume, (newVal) => {
 【支持横竖屏推流能力】
-若您需要支持横竖屏推流能力，包括设置切换横竖屏等内容，请参考如下代码示例复制到`live-pusher.vue `文件中即可。
+ 若您需要支持横竖屏推流能力，包括设置切换横竖屏等内容，请参考如下代码示例复制到 `live-pusher.vue` 文件中即可。
 ``` typescript
 <!-- LayoutSwitch 横竖屏推流设置 -->
 <template>
@@ -377,7 +383,7 @@ const handleOrientationSwitch = () => {
 【支持连观众能力】
-若您需要支持观众连麦能力，包括设置连麦申请、连麦管理等内容，请参考如下代码示例复制到`live-pusher.vue `文件中即可。
+若您需要支持观众连麦能力，包括设置连麦申请、连麦管理等内容，请参考如下代码示例复制到 `live-pusher.vue` 文件中即可。
 ``` typescript
 <!-- CoGuestButton 观众连麦设置 -->
 <template>
@@ -430,7 +436,7 @@ watch(disabled, () => {
 【支持布局设置能力】
-若您需要支持视频流切换布局能力，包括设置**动态宫格布局、静态宫格布局、静态小窗布局、浮动小窗布局**等内容，请参考如下代码示例复制到`live-pusher.vue `文件中即可。
+若您需要支持视频流切换布局能力，包括设置**动态宫格布局、静态宫格布局、静态小窗布局、浮动小窗布局**等内容，请参考如下代码示例复制到 `live-pusher.vue` 文件中即可。
 ``` typescript
 <!-- OrientationSwitch 布局设置 -->
 <template>
@@ -623,10 +629,10 @@ function handleCancel() {
 ### 横竖屏推流设置
 `TUILiveKit` 支持**横屏**和**竖屏**两种推流模式，您可根据直播场景选择合适的推流方向：
-| **推流模式** | **适用场景** | **说明** |
+| <strong>推流模式</strong> | <strong>适用场景</strong> | <strong>说明</strong> |
 | --- | --- | --- |
-| **竖屏推流** | 秀场直播、电商带货、聊天互动 | 默认模式，适合移动端观看，画面比例为 9:16。 |
-| **横屏推流** | 游戏直播、在线教育、会议直播 | 适合 PC 端观看，画面比例为 16:9。 |
+| <strong>竖屏推流</strong> | 秀场直播、电商带货、聊天互动 | 默认模式，适合移动端观看，画面比例为 9:16。 |
+| <strong>横屏推流</strong> | 游戏直播、在线教育、会议直播 | 适合 PC 端观看，画面比例为 16:9。 |
 > **注意：**
 >
@@ -669,20 +675,20 @@ updateLiveInfo({ layoutTemplate: 600 });
 #### 竖屏模式布局模板
 竖屏模式下提供 **4 种布局模板**，适用于秀场直播、电商带货等场景：
-| **名称** | **动态宫格布局** | **动态 1V6 布局** | **静态宫格布局** | **静态小窗布局** |
+| <strong>名称</strong> | <strong>动态宫格布局</strong> | <strong>动态 1V6 布局</strong> | <strong>静态宫格布局</strong> | <strong>静态小窗布局</strong> |
 | --- | --- | --- | --- | --- |
-| **模板 ID** | 600 | 601 | 800 | 801 |
-| **描述** | **默认布局**，根据连麦人数动态调整宫格大小，画面自适应填充。 | 主播画面居中大窗显示，连麦嘉宾以**浮动小窗**形式环绕在主播周围。 | 固定 9 宫格布局，每个嘉宾占据一个**固定大小**的宫格位置。 | 主播画面全屏显示，连麦嘉宾以**固定小窗**形式显示在画面边缘。 |
-| **适用场景** | 通用场景，连麦人数不固定。 | 主播为主、嘉宾为辅的互动场景。 | 多人连麦、语音聊天室等固定人数场景。 | 主播全屏展示、嘉宾辅助的场景。 |
+| <strong>模板 ID</strong> | 600 | 601 | 800 | 801 |
+| <strong>描述</strong> | <strong>默认布局</strong>，根据连麦人数动态调整宫格大小，画面自适应填充。 | 主播画面居中大窗显示，连麦嘉宾以<strong>浮动小窗</strong>形式环绕在主播周围。 | 固定 9 宫格布局，每个嘉宾占据一个<strong>固定大小</strong>的宫格位置。 | 主播画面全屏显示，连麦嘉宾以<strong>固定小窗</strong>形式显示在画面边缘。 |
+| <strong>适用场景</strong> | 通用场景，连麦人数不固定。 | 主播为主、嘉宾为辅的互动场景。 | 多人连麦、语音聊天室等固定人数场景。 | 主播全屏展示、嘉宾辅助的场景。 |
 #### 横屏模式布局模板
 横屏模式下提供 **1 种布局模板**，适用于游戏直播、在线教育等场景：
-| **名称** | **横屏浮动布局** |
+| <strong>名称</strong> | <strong>横屏浮动布局</strong> |
 | --- | --- |
-| **模板 ID** | 200 |
-| **描述** | 主播画面全屏显示，连麦嘉宾以**浮动小窗**形式显示在画面底部。 |
-| **适用场景** | 游戏直播、屏幕分享、在线教育等需要横屏展示的场景。 |
+| <strong>模板 ID</strong> | 200 |
+| <strong>描述</strong> | 主播画面全屏显示，连麦嘉宾以<strong>浮动小窗</strong>形式显示在画面底部。 |
+| <strong>适用场景</strong> | 游戏直播、屏幕分享、在线教育等需要横屏展示的场景。 |
 #### 通过代码设置布局模板
@@ -719,7 +725,7 @@ updateLiveInfo({ layoutTemplate: 200 });
 ### 颜色主题及语言
 通过配置 `App.vue` 中 `UIKitProvider` 的入参，修改主题及语言的默认值。
-| **UIKitProvider 参数** | **可选值** | **默认值** |
+| <strong>UIKitProvider 参数</strong> | <strong>可选值</strong> | <strong>默认值</strong> |
 | --- | --- | --- |
 | theme | "light" \\| "dark" | "light" |
 | language | "zh-CN" \\| "en-US" | "en-US" |
@@ -735,20 +741,19 @@ import { UIKitProvider } from '@tencentcloud/uikit-base-component-vue3';
 ### 按钮 Button 和图标 Icon
-若您需要对按钮 Button 或图标 Icon 等其他控件进行新增或替换等 UI 定制，您可以通过如下方式实现，以`live-player.vue `文件中的按钮和图标为例，您可以参考下图找到对应按钮或图标的指定位置源码，对当前部分的控件进行**增加、删除、替换**等 UI 定制操作。
+若您需要对按钮 Button 或图标 Icon 等其他控件进行新增或替换等 UI 定制，您可以通过如下方式实现，以 `live-player.vue` 文件中的按钮和图标为例，您可以参考下图找到对应按钮或图标的指定位置源码，对当前部分的控件进行**增加、删除、替换**等 UI 定制操作。
 根据上述示例，我们同样支持您根据项目需求对**观众观看页面**进行 UI 定制的能力。除了页面 UI 布局调整，我们也支持您对**颜色主题、字体、圆角、按钮、图标、输入框、弹框等**内容进行**增加、删除、修改**等操作，满足您的 UI 定制需要。
-| **类别** | **功能** | **描述** | **组件详细定制指引** |
+| <strong>类别</strong> | <strong>功能</strong> | <strong>描述</strong> | <strong>组件详细定制指引</strong> |
 | --- | --- | --- | --- |
-| **素材管理** | 自定义素材管理区域展示 | **支持：**<br>- **调整展示 Icon 的大小、颜色或对 Icon 进行替换。** | [媒体源配置面板](https://cloud.tencent.com/document/product/647/123838) |
-| **在线观众** | 自定义观众信息展示 | **支持：**<br>- **展示/隐藏观众等级。**<br>- **观众信息字体、颜色 UI 自定义设置。**<br>- **替换为您需要的 Icon 风格。** | [视频源编辑画板](https://cloud.tencent.com/document/product/647/123834) |
-| **消息列表** | 自定义消息弹幕区域展示 | **支持：**<br>- **展示/隐藏聊天输入区域。**<br>- **支持 UI 定制聊天气泡风格、定制观众等级等内容。** | [聊天弹幕组件](https://cloud.tencent.com/document/product/647/123836) |
+| <strong>素材管理</strong> | 自定义素材管理区域展示 | <strong>支持：</strong><br>- <strong>调整展示 Icon 的大小、颜色或对 Icon 进行替换。</strong> | <a href="https://cloud.tencent.com/document/product/647/123838">媒体源配置面板</a> |
+| <strong>在线观众</strong> | 自定义观众信息展示 | <strong>支持：</strong><br>- <strong>展示/隐藏观众等级。</strong><br>- <strong>观众信息字体、颜色 UI 自定义设置。</strong><br>- <strong>替换为您需要的 Icon 风格。</strong> | <a href="https://cloud.tencent.com/document/product/647/123834">视频源编辑画板</a> |
+| <strong>消息列表</strong> | 自定义消息弹幕区域展示 | <strong>支持：</strong><br>- <strong>展示/隐藏聊天输入区域。</strong><br>- <strong>支持 UI 定制聊天气泡风格、定制观众等级等内容。</strong> | <a href="https://cloud.tencent.com/document/product/647/123836">聊天弹幕组件</a> |
 ## 下一步
 恭喜您，现在您已经成功集成了**主播开播页面 **。接下来，您可以实现**观众观看页**、**直播列表页**和 **UI 自定义**等内容，可参考下表：
-| **功能** | **描述** | **集成指引** |
+| <strong>功能</strong> | <strong>描述</strong> | <strong>集成指引</strong> |
 | --- | --- | --- |
-| **观众观看** | 实现观众进入主播的直播间后观看直播，实现观众连麦 、直播间信息、在线观众、弹幕显示等功能。 | 观众观看 |
-| **直播列表** | 展示直播列表界面和功能，包含直播列表，房间信息展示功能。 | 直播列表 |
-| **UI 自定义** | 更详细的 UI 组件自定义指引。 | 概述 |
+| <strong>观众观看</strong> | 实现观众进入主播的直播间后观看直播，实现观众连麦 、直播间信息、在线观众、弹幕显示等功能。 | 观众观看 |
+| <strong>直播列表</strong> | 展示直播列表界面和功能，包含直播列表，房间信息展示功能。 | 直播列表 |