@tencentcloud/sdk-mcp 1.0.7 → 1.0.9

package/resource/doc/chatuikit/react/integrate_tuichat_only_react.md

@@ -1,185 +0,0 @@
-## 适用场景
-
-Web & H5 平台，独立集成私信聊天（1V1）或者群聊（Group），例如房产中介咨询、电商在线客服、保险远程定损等。
-
-![](https://write-document-release-1258344699.cos.ap-guangzhou.tencentcos.cn/100027666621/d6a3e0917e4811ef96bb5254000dcb0f.png)
-
-
-## 开发环境要求
-- React ≥ v18.0 （17.x 版本不支持）
-
-- TypeScript
-
-- node（node.js ≥ 16.0.0）
-
-- npm（版本请与 node 版本匹配）
-
-
-## chat-uikit-react 集成
-
-### 步骤1：创建项目
-1. 创建一个新的 React 项目，您可自行选择是否需要使用 ts 模板。
-
-   
-   
-   【shell】
-   ``` bash
-   npx create-react-app sample-chat --template typescript
-   ```
-2. 创建项目完成后，切换到项目所在目录。
-
-   
-   
-   【shell】
-   ``` bash
-   cd sample-chat
-   ```
-
-### 步骤2：下载 chat-uikit-react 组件
-
-通过 npm 方式下载  [chat-uikit-react](https://www.npmjs.com/package/@tencentcloud/chat-uikit-react) 并在项目中使用。
-
-
-【shell】
-``` bash
-npm i @tencentcloud/chat-uikit-react @tencentcloud/uikit-base-component-react
-```
-
-### 步骤3：引入 chat-uikit-react 组件，创建并打开会话进行聊天
-
-> **注意：**
-> 
-
-> 以下代码中未填入 `SDKAppID`、`userID` 和 `userSig`，需在 [步骤4](https://write.woa.com/#step4) 中获取相关信息后进行替换。
-> 
-
-
-> **说明：**
-> 
-> - 关于群聊： 
-> - 可以通过调用 API [createC2CConversation](https://write.woa.com/document/157860942511771648) 来创建单聊。
-> - 可以通过调用 API [createGroupConversation](https://write.woa.com/document/157860942511771648) 来创建群聊。
-> - 进入聊天的方式：
-> - 通过调用 API [setActiveConversation](https://write.woa.com/document/157860942511771648)，传入 conversationID 进入聊天页面。
-
-
-替换 App.tsx 中的内容，或者您可以新建一个组件引入。
-``` javascript
-import React from 'react';
-import {
-  Chat,
-  ChatHeader,
-  MessageList,
-  MessageInput,
-  ChatSetting,
-  Search,
-  VariantType,
-  useUIOpenControlState,
-  useLoginState,
-  useConversationListState,
-} from '@tencentcloud/chat-uikit-react';
-import { UIKitProvider } from '@tencentcloud/uikit-base-component-react';
-
-const config = {
-  SDKAppID: 0, // 您的 SDKAppID， 参考步骤4
-  userID: 'test-user1', // 您登录的 UserID， 参考步骤4
-  userSig: '', // 您的 userSig, 参考步骤4
-}
-
-export default function App() { 
-  // 语言支持 en-US(default) / zh-CN / ja-JP / ko-KR / zh-TW
-  // 主题支持 light(default) / dark
-  const { isChatSettingOpen, isChatSearchOpen } = useUIOpenControlState();
-  const { setActiveConversation, createC2CConversation } = useConversationListState();
-  const { login } = useLoginState();
-  login(config).then(() => {
-      const userID = 'test-user2'; // userID: 消息接收方的 userID
-      createC2CConversation(userID).then((conversation) => {
-        setActiveConversation(conversation.conversationID);
-      })
-  }).catch(() => {});
-  return (
-    <div style={{display: 'flex', height: '100vh'}}>
-      <UIKitProvider language='en-US' theme='light'>
-        <Chat>
-          <ChatHeader />
-          <MessageList />
-          <MessageInput />
-        </Chat>
-        {isChatSettingOpen && <ChatSetting />}
-        {isChatSearchOpen &&  <Search style={{ minWidth: '300px'}} variant={VariantType.EMBEDDED} />}
-      </UIKitProvider>
-    </div>   
-  );
-}
-```
-
-### 步骤4：获取 SDKAppID、userID 和 userSig
-- SDKAppID：SDKAppID 是腾讯云 IM 服务区分客户账号的唯一标识。我们建议每一个独立的 App 都申请一个新的 SDKAppID。不同 SDKAppID 之间的消息是天然隔离的，不能互通。
-
-
-   您可以在 [即时通信 IM 控制台](https://console.cloud.tencent.com/im) 查看所有的 SDKAppID，单击**创建新应用**，可以创建新的 SDKAppID。
-
-   ![](https://write-document-release-1258344699.cos.ap-guangzhou.tencentcos.cn/100027666621/bd48a26f1c9a11efb275525400720cb5.png)
-
-- userID：可通过单击 [即时通信 IM 控制台 > 账号管理](https://console.cloud.tencent.com/im/account-management)，切换至目标应用所在账号，即可创建账号并获取 userID。**您可以创建两个或多个 userID 便于体验聊天。**
-
-
-   **例如：创建 test-user1、test-user2 两个账号**
-
-   ![](https://write-document-release-1258344699.cos.ap-guangzhou.tencentcos.cn/100027666621/bd56161b1c9a11efb7495254005ac0ca.png)
-
-- userSig：可单击 [即时通信 IM 控制台 > 开发工具 > UserSig生成&校验](https://console.cloud.tencent.com/im/tool-usersig)，填写创建的 UserID，即可生成 UserSig。
-
-   ![](https://write-document-release-1258344699.cos.ap-guangzhou.tencentcos.cn/100027666621/bd2617a61c9a11ef949d52540019e87e.png)
-
-
-### 步骤5：启动项目
-
-
-【shell】
-``` bash
- npm run start
-```
-
-> **注意：**
-> 
-> 1. 请确保 [步骤3](https://write.woa.com/#step3) 代码中  SDKAppID、userID 和 userSig 均已成功替换，如未替换将会导致项目表现异常。
-> 2. userID 和 userSig  为一一对应关系，具体参见 [生成 UserSig](https://console.cloud.tencent.com/im/tool-usersig)。
-> 3. 如遇到项目启动失败，请检查 开发环境要求 是否满足。
-
-
-### 步骤6：发送您的第一条消息
-
-在输入框输入消息，按下 **enter **键发送。
-
-![](https://write-document-release-1258344699.cos.ap-guangzhou.tencentcos.cn/100027666621/511f1c4d7e4811efb9d8525400f69702.png)
-
-
-## 常见问题
-
-#### 什么是 UserSig？
-
-UserSig 是用户登录即时通信 IM 的密码，其本质是对 UserID 等信息加密后得到的密文。
-
-#### 如何生成 UserSig？
-
-UserSig 签发方式是将 UserSig 的计算代码集成到您的服务端，并提供面向项目的接口，在需要 UserSig 时由您的项目向业务服务器发起请求获取动态 UserSig。更多详情请参见 [服务端生成 UserSig](https://cloud.tencent.com/document/product/269/32688)。
-
-> **注意：**
-> 
-
-> 本文示例代码采用的获取 UserSig 的方案是在客户端代码中配置 SECRETKEY，该方法中 SECRETKEY 很容易被反编译逆向破解，一旦您的密钥泄露，攻击者就可以盗用您的腾讯云流量，因此**该方法仅适合本地跑通功能调试**。 正确的 UserSig 签发方式请参见上文。
-> 
-
-
-#### 是否支持 react 17.x 版本？
-
-目前不支持 17.x 版本，仅支持 React ≥ v18.0。
-
-## 参考文档
-- [chat-uikit-react npm](https://www.npmjs.com/package/@tencentcloud/chat-uikit-react)
-
-- [Demo源码及跑通示例](https://github.com/TencentCloud/chat-uikit-react)
-
-

package/resource/doc/chatuikit/react/integrate_tuichat_react.md

@@ -1,212 +0,0 @@
-## chat-uikit-react 介绍
-
-chat-uikit-react 是基于腾讯云 Chat SDK 的一款 react UI 组件库，它提供了一些通用的 UI 组件，包含会话、聊天、群组等功能。基于这些精心设计的 UI 组件，您可以快速构建优雅的、可靠的、可扩展的 Chat 应用。 chat-uikit-react 界面效果如下图所示：
-
-您可以在线体验：
-- [Web Demo](https://web.sdk.qcloud.com/im/demo/react/index.html?scene=social)
-
-- [H5 Demo](https://trtc.io/demo/homepage/#/detail?scene=messenger)
-
-
-   **TUIKit Web 端**界面效果如下图所示：
-
-   ![](https://write-document-release-1258344699.cos.ap-guangzhou.tencentcos.cn/100027666621/73e9ee987e4611efa9f2525400044e04.png)
-
-
-   **TUIKit H5 端**界面效果如下图所示：
-
-   ![](https://write-document-release-1258344699.cos.ap-guangzhou.tencentcos.cn/100027666621/847619c67e4611ef80ff525400d5f8ef.png)
-
-
-## 开发环境要求
-- React v18
-
-- TypeScript
-
-- Node.js ≥ v18
-
-- npm（版本请与 node 版本匹配）
-
-
-## chat-uikit-react 集成
-
-### 步骤1：创建项目
-
-创建一个新的名为 **chat-app** 的 React 项目（创建项目时选择 React 18，并且建议使用 TypeScript 模板），并按照提示跑通脚手架初始项目。
-
-
-【shell】
-``` bash
-npm create rsbuild@latest
-```
-
-### 步骤2：下载 chat-uikit-react 组件
-
-通过 npm 方式下载 [chat-uikit-react](https://www.npmjs.com/package/@tencentcloud/chat-uikit-react) 并在项目中使用。
-
-
-【shell】
-``` bash
-npm i @tencentcloud/chat-uikit-react
-```
-
-### 步骤3：引入 chat-uikit-react 组件
-
-> **注意：**
-> 
-> - 以下代码中未填入 `SDKAppID`、`userID` 和 `userSig`，需在 [步骤4](https://write.woa.com/#step4) 中获取相关信息后进行替换。
-> - 为了尊重表情符号设计的版权，Demo/UIKit 项目不包括大型表情元素的剪切图。请在正式商业发布之前，用您自己设计或拥有版权的表情包替换它们。默认的小黄脸表情包由腾讯云拥有版权，并可以收费授权。如果您希望获得授权，请提交工单与我们联系。
-
-
-替换 App.tsx 中的内容，或者您可以新建一个组件引入。
-``` typescript
-import {
-  UIKitProvider,
-  useLoginState,
-  LoginStatus,
-  ConversationList,
-  Chat,
-  ChatHeader,
-  MessageList,
-  MessageInput,
-  useUIOpenControlState,
-  ChatSetting,
-  Search,
-  VariantType,
-  ContactList,
-  ContactInfo,
-} from "@tencentcloud/chat-uikit-react";
-import { useState } from "react";
-
-function App() {
-  const { isChatSettingOpen, isChatSearchOpen } = useUIOpenControlState();
-  const [activeTab, setActiveTab] = useState('chats');
-
-  const { status } = useLoginState({
-    SDKAppID: 0, // 参考步骤 4
-    userID: '',  // 参考步骤 4
-    userSig: '', // 参考步骤 4
-  })
-
-  if (status !== LoginStatus.SUCCESS) {
-    return <div>Loading...</div>
-  }
-  
-  // 语言支持 en-US(default) / zh-CN / ja-JP / ko-KR / zh-TW
-  // 主题支持 light(default) / dark
-  return (
-    <UIKitProvider>
-      <div style={{ height: '100vh', width: '100vw', display: 'flex', flexDirection: 'row' }}>
-        <ul>
-          <li onClick={() => {setActiveTab('chats')}}>chats</li>
-          <li onClick={() => {setActiveTab('contacts')}}>contact</li>
-        </ul>
-        {
-          activeTab === 'chats' && (
-            <>
-              <ConversationList style={{ minWidth: '300px', maxWidth: '350px' }}/>
-              <Chat PlaceholderEmpty="No messages yet">
-                <ChatHeader />
-                <MessageList />
-                <MessageInput />
-              </Chat>
-              {isChatSettingOpen && <ChatSetting />}
-              {isChatSearchOpen &&  <Search style={{ minWidth: '300px'}} variant={VariantType.EMBEDDED} />}
-            </>
-          )
-        }
-        {
-          activeTab === 'contacts' && (
-            <>
-              <ContactList style={{ minWidth: '300px', maxWidth: '350px' }}/>
-              <ContactInfo 
-                PlaceholderEmpty="No contact yet"
-                onSendMessage={() => {setActiveTab('chats')}}
-                onEnterGroup={() => {setActiveTab('chats')}}
-              />
-            </>
-          )
-        }
-      </div>
-    </UIKitProvider>
-  );
-}
-
-export default App;
-```
-
-### 步骤4：获取 SDKAppID、userID 和 userSig
-- SDKAppID：SDKAppID 是腾讯云 IM 服务区分客户账号的唯一标识。我们建议每一个独立的 App 都申请一个新的 SDKAppID。不同 SDKAppID 之间的消息是天然隔离的，不能互通。
-
-
-   您可以在 [即时通信 IM 控制台](https://console.cloud.tencent.com/im) 查看所有的 SDKAppID，单击**创建新应用**，可以创建新的 SDKAppID。
-
-   ![](https://write-document-release-1258344699.cos.ap-guangzhou.tencentcos.cn/100027666621/ce047e42ce0d11eeb6e6525400170219.png)
-
-- userID：可通过单击 [ 即时通信 IM 控制台 -【账号管理】](https://console.cloud.tencent.com/im/account-management)，切换至目标应用所在账号，即可创建账号并获取 userID。
-
-   ![](https://write-document-release-1258344699.cos.ap-guangzhou.tencentcos.cn/100027666621/f1d10c67175311efa66f525400f65c2a.png)
-
-- userSig：可单击 [ 即时通信 IM 控制台 > 开发工具 > UserSig生成&校验](https://console.cloud.tencent.com/im/tool-usersig)，填写创建的 userID，即可生成 userSig。
-
-   ![](https://write-document-release-1258344699.cos.ap-guangzhou.tencentcos.cn/100027666621/47b38334175311ef9c015254002977b6.png)
-
-
-### 步骤5：启动项目
-
-
-【shell】
-``` bash
- npm run dev
-```
-
-> **注意：**
-> 
-> 1. 请确保 [步骤3](https://write.woa.com/#step3) 代码中  SDKAppID、userID 和 userSig 均已成功替换，如未替换将会导致项目表现异常。
-> 2. userID 和 userSig  为一一对应关系，具体参见 [生成 UserSig（用户鉴权）](https://write.woa.com/document/107052240244191232)。
-> 3. 如遇到项目启动失败，请检查 开发环境要求 是否满足。
-
-
-### 步骤6：发送您的第一条消息
-1. 项目启动成功后，单击 **+ **图标，创建会话。
-
-2. 在输入框中搜索另一个用户的 userID（参考：[步骤4 -> 创建账号并获取 userID](https://write.woa.com/#step4)）。
-
-3. 单击用户头像发起会话。
-
-4. 在输入框输入消息，按下 **Enter **键发送。
-
-   ![](https://write-document-release-1258344699.cos.ap-guangzhou.tencentcos.cn/100025598411/6bd24a6ecd3d11ed9d66525400c56988.gif)
-
-
-## 常见问题
-
-#### 什么是 UserSig？
-
-UserSig 是用户登录即时通信 IM 的密码，其本质是对 UserID 等信息加密后得到的密文。
-
-#### 如何生成 UserSig？
-
-UserSig 签发方式是将 UserSig 的计算代码集成到您的服务端，并提供面向项目的接口，在需要 UserSig 时由您的项目向业务服务器发起请求获取动态 UserSig。更多详情请参见 [服务端生成 UserSig](https://cloud.tencent.com/document/product/269/32688)。
-
-> **注意：**
-> 
-
-> 本文示例代码采用的获取 UserSig 的方案是在客户端代码中配置 SECRETKEY，该方法中 SECRETKEY 很容易被反编译逆向破解，一旦您的密钥泄露，攻击者就可以盗用您的腾讯云流量，因此**该方法仅适合本地跑通功能调试**。 正确的 UserSig 签发方式请参见上文。
-> 
-
-
-#### 是否支持 react 17.x 版本？
-
-目前不支持 17.x 版本，仅支持 React v18。
-
-## 相关文档
-
-## 参考文档
-
-#### UIKit 相关：
-- [chat-uikit-react npm](https://www.npmjs.com/package/@tencentcloud/chat-uikit-react)
-
-- [Demo 跑通示例](https://github.com/TencentCloud/chat-uikit-react)
-
-

package/resource/doc/chatuikit/vue/integrate_tuichat_only_vue.md

@@ -1,149 +0,0 @@
-## 适用场景
-
-Web & H5 平台，独立集成私信聊天（1V1）或者群聊（Group），例如房产中介咨询、电商在线客服、保险远程定损等。
-
-![](https://write-document-release-1258344699.cos.ap-guangzhou.tencentcos.cn/100027116646/003531a5822811f0b3fe525400bf7822.png)
-
-
-## 开发环境要求
-- vue3
-
-- TypeScript
-
-- node（node.js ≥ 16.0.0）
-
-- npm（版本请与 node 版本匹配）
-
-
-## 集成指引
-
-### 步骤1：创建项目
-1. 创建一个新的名称为 **chat-example** 的 Vue3 项目，您可自行选择是否需要使用 ts 模板。
-
-   
-   
-   【shell】
-   ``` bash
-   npm create vite@latest
-   ```
-2. 创建项目完成后，切换到项目所在目录。
-
-   
-   
-   【shell】
-   ``` bash
-   cd chat-example
-   npm install
-   ```
-
-### 步骤2：下载 chat-uikit-vue3 组件
-
-
-【shell】
-``` bash
-npm i @tencentcloud/chat-uikit-vue3
-```
-
-### 步骤3：仅引入 Chat 相关组件
-
-##### 在 App.vue 页面中实现以下代码，即可快速搭建聊天界面并开启指定会话：
-
-> **说明：**
-> 
-
-> conversationID：会话 ID。会话ID组成方式如下：
-> 
-> - C2C${userID}（单聊），例如 `C2C123456`
-> - GROUP${groupID}（群聊），例如 `GROUP123456`
-
-``` javascript
-<template>
-  <div class="app">
-      <UIKitProvider>
-        <Chat style="flex: 1;">
-          <ChatHeader />
-          <MessageList />
-          <MessageInput />
-        </Chat>
-      </UIKitProvider>
-  </div>
-</template>
-<script lang="ts" setup>
-import {
-  Chat,
-  MessageList,
-  MessageInput,
-  ChatHeader,
-  UIKitProvider,
-  useLoginState,
-  useConversationListState,
-} from '@tencentcloud/chat-uikit-vue3';
-const config = {
-  sdkAppId : 0, // SDKAppID, 可以参考步骤 4 获取
-  userId: 'xxx', // UserID, 可以参考步骤 4 获取
-  userSig: 'xxx', // userSig, 可以参考步骤 4 获取
-}
-
-const { login } = useLoginState();
-const { setActiveConversation } = useConversationListState();
-const conversationID="YOUR_CONVERSATIONID"; // 参考说明设置您需要的会话 ID。
-
-login({
-  ...config,
-  useUploadPlugin: true
-})
-.then(() => {
-    setActiveConversation(conversationID)
-})
-.catch(() => {});
-</script>
-<style lang="scss">
-.app {
-  width: 100vw;
-  height: 100vh;
-  display: flex;
-}
-</style>
-```
-
-### 步骤4：获取 SDKAppID、userID 和 userSig
-- SDKAppID：SDKAppID 是腾讯云 IM 服务区分客户账号的唯一标识。我们建议每一个独立的 App 都申请一个新的 SDKAppID。不同 SDKAppID 之间的消息是天然隔离的，不能互通。
-
-
-   您可以在 [即时通信 IM 控制台](https://console.cloud.tencent.com/im) 查看所有的 SDKAppID，单击**创建新应用**，可以创建新的 SDKAppID。
-
-   ![](https://write-document-release-1258344699.cos.ap-guangzhou.tencentcos.cn/100027116646/a8b350bd822a11f08aa952540099c741.png)
-
-- userID：可通过单击 [ 即时通信 IM 控制台 -【账号管理】](https://console.cloud.tencent.com/im/account-management)，切换至目标应用所在账号，即可创建账号并获取 userID。
-
-   ![](https://write-document-release-1258344699.cos.ap-guangzhou.tencentcos.cn/100027116646/a8c18ed1822a11f0b3fe525400bf7822.png)
-
-- userSig：可单击 [ 即时通信 IM 控制台 > 开发工具 > UserSig生成&校验](https://console.cloud.tencent.com/im/tool-usersig)，填写创建的 userID，即可生成 userSig。
-
-   ![](https://write-document-release-1258344699.cos.ap-guangzhou.tencentcos.cn/100027116646/a8bd7f1e822a11f0b1df52540044a08e.png)
-
-
-### 步骤5：启动项目
-
-
-【shell】
-``` bash
- npm run dev
-```
-
-> **注意：**
-> 
-> 1. 请确保 [步骤3](https://write.woa.com/#step3) 代码中  SDKAppID、userID 和 userSig 均已成功替换，如未替换将会导致项目表现异常。
-> 2. userID 和 userSig  为一一对应关系，具体参见 生成 UserSig。
-> 3. 如遇到项目启动失败，请检查 开发环境要求 是否满足。
-
-
-## 相关文档
-- [chat-uikit-vue3 npm](https://www.npmjs.com/package/@tencentcloud/chat-uikit-vue3)
-
-- [github Demo](https://github.com/Tencent-RTC/TUIKit_Vue3/tree/main/demos/rtcube-vite-vue3)
-
-
-## 交流与反馈
-
-如遇任何问题，可联系 [官网售后](https://cloud.tencent.com/act/event/connect-service#/) 反馈，享有专业工程师的支持，解决您的难题。