概述
本文档为开发者提供了清晰、高效的步骤,用于在支持 AI 辅助编程的 IDE(例如 Cursor、TRAE、CodeBuddy、VSCode)中,通过 Model Context Protocol (模型上下文协议)Server 快速集成
RoomKit组件,从而通过 AI 自动生成项目初始化和集成代码。通过配置 MCP Server,AI 可以调用 @tencentcloud/sdk-mcp提供的工具集,帮您完成以下工作:帮您自动初始化项目并安装所需依赖。
帮您自动生成 RoomKit 组件的集成代码,让您快速拥有创建房间、加入房间、会中邀请、成员管理、基础美颜等核心功能,无需手动编写大量重复性代码。
核心功能界面展示
界面效果如下图所示:


步骤1:环境准备
1. 开发环境准备
确保您的本地开发环境中安装了推荐版本的 Node.js 和 npm (Node Package Manager)。
下载与安装:
请访问 Node.js 官方网站 下载并安装适用于您操作系统的版本。
推荐版本:建议使用 Node.js LTS (长期支持) 版本,通常在 18.x 或 20.x 系列。
验证安装:
安装完成后,请打开您电脑上的命令窗口(或叫命令提示符、终端),运行以下命令验证版本:
Windows 系统: 请按下键盘上的
Win 键 + R 键,输入cmd,然后按回车键打开。Mac 系统: 请按下
Command+ 空格键,输入 终端 或 Terminal,然后按回车键打开。node -vnpm -v
如果能正确显示版本号,则环境准备完成。
如果提示没有相关命令或其他错误,请将完整的错误信息截图或文字内容提供给 AI,以便更高效地找到解决方案。
2. 获取应用信息
步骤2:MCP 工具配置
在使用 MCP 工具前,您需要在代码编辑器(例如:Cursor、TRAE、CodeBuddy、VSCode)的配置面板中进行设置。推荐您配置到当前项目的根目录下。
1. 下载 Cursor。
2. 用
Cursor打开您的项目。3. 在项目根目录下创建 MCP 配置文件:
在项目根目录创建
.cursor文件夹(如果不存在)。 在
.cursor 文件夹中创建 mcp.json 文件。 将以下配置信息复制到
mcp.json 文件中,并把 env 中的 SDKAppID 和 secretKey替换为您自己的应用信息。{"mcpServers": {"tencentcloud-sdk-mcp": {"command": "npx","args": ["-y", "@tencentcloud/sdk-mcp"],"env": {"SDKAPPID": "YOUR_SDKAPPID","SECRETKEY": "YOUR_SECRET_KEY"}}}}
注意:
请及时保存您修改的配置文件:
Windows 用户:
Ctrl + S,Mac 用户: Command + S 。4. 当保存文件时,会弹出下图提示,选择 Enable 开启 MCP 工具。

5. 配置完成,在 Cursor 的 Settings - Tools & MCP 选项中检查 MCP 工具是否成功加载 tools。

1. 下载 TRAE。
2. 单击设置 > MCP > +添加 > 手动添加。

3. 单击原始配置(JSON)打开配置文件,把
mcpServers 的配置信息更新到配置文件,并把 env 中的 SDKAppID 和 secretKey替换为您自己的应用信息。{"mcpServers": {"tencentcloud-sdk-mcp": {"command": "npx","args": ["-y", "@tencentcloud/sdk-mcp"],"env": {"SDKAPPID": "YOUR_SDKAPPID","SECRETKEY": "YOUR_SECRET_KEY"}}}}
注意:
请及时保存您修改的配置文件:
Windows 用户:
Ctrl + S,Mac 用户: Command + S 。
4. 选择编辑器默认的 Builder with MCP 或者将 MCP 添加到您自定义的 Builder 中。

1. 下载 CodeBuddy。
2. 单击设置 > 添加 MCP 打开
settings.json 配置 MCP。
3. 把
mcpServers 的配置信息更新到 settings.json文件中,并把 env 中的 SDKAppID 和 secretKey替换为您自己的应用信息。{"mcpServers": {"tencentcloud-sdk-mcp": {"command": "npx","args": ["-y", "@tencentcloud/sdk-mcp"],"env": {"SDKAPPID": "YOUR_SDKAPPID","SECRETKEY": "YOUR_SECRET_KEY"}}}}
注意:
请及时保存您修改的配置文件:
Windows 用户:
Ctrl + S,Mac 用户: Command + S 。4. 检查 MCP 工具是否成功加载 tools。

1. 安装 VS Code CodeBuddy 插件。

2. 插件安装成功后,在侧边栏找到 CODEBUDDY 入口,单击 MCP 市场图标 > 已安装 > 配置 MCP Server。


3. 把
mcpServers 的配置信息更新到配置文件中,并把 env 中的 SDKAppID 和 secretKey替换为您自己的应用信息。{"mcpServers": {"tencentcloud-sdk-mcp": {"command": "npx","args": ["-y", "@tencentcloud/sdk-mcp"],"env": {"SDKAPPID": "YOUR_SDKAPPID","SECRETKEY": "YOUR_SECRET_KEY"}}}}
注意:
请及时保存您修改的配置文件:
Windows 用户:
Ctrl + S,Mac 用户: Command + S 。4. 保存成功后检查 MCP 工具是否成功加载 tools。

步骤3:使用 AI 集成 RoomKit
配置完成后,您即可用提示词与 AI 进行对话,快速集成
RoomKit 组件。注意:
如果您已经配置了
SDKAppID 和 secretKey ,在集成过程中会自动帮您生成和填写测试 UserID 和 UserSig,您可以跳过获取登录账号信息和填写登录凭据步骤 。如果您没有配置
SDKAppID 和 secretKey ,请务必在 MCP 环境变量中进行配置。场景一:新建项目并集成 RoomKit (推荐)
创建和初始化项目
输入提示词, AI 帮您自动创建项目,并根据您的具体需求集成
RoomKit的多人视频会议功能。提示词示例:
1. 请使用 RoomKit 组件实现一个多人视频会议功能。2. 请使用 RoomKit State API 自定义 UI 实现一个适配 H5 的多人视频会议功能。
获取登录账号信息
RoomKit 集成完成后,您需要获取 SDKAppID 登录的账号信息。提示词示例:
请使用 MCP 工具,生成 test001 的 userSig。
填写登录凭据
AI 输出账号信息后,让 AI 自动将所有登录信息填入代码。
提示词示例:
请将 SDKAppID、userID、userSig 填写到代码中。
场景二:在已有项目中集成 RoomKit
依赖安装和组件导入
输入提示词, AI 帮您在已有项目中集成
RoomKit 组件,您可以选择使用 UI 组件集成或 RoomKit State API 集成。提示词中请务必指定目标文件路径,以提高 AI 操作的准确性(例如:请在 src/views/room.vue 中集成)。提示词示例:
1. 请在 xxx 中用 Roomkit 组件集成多人视频会议功能。2. 请在 xxx 中用 RoomKit State API 实现一个多人视频会议功能。
获取登录账号信息
RoomKit 集成完成后,您需要获取 SDKAppID 登录的账号信息。提示词示例:
请使用 MCP 工具,生成 test001 的 userSig。
填写登录凭据
AI 输出签名后,让 AI 自动将所有登录信息填入代码。
提示词示例:
请将 SDKAppID、userID、userSig 填写到代码中。
步骤4:运行与测试项目
AI 会尝试使用项目中配置的启动命令(例如
npm run dev、pnpm run dev)启动项目。如果项目没有自动启动,您可以手动输入启动指令,AI 会自动执行。
常见问题
如何手动安装 MCP Server ?
如果您需要手动安装 MCP Server, 请在终端执行以下命令:
npx -y @tencentcloud/sdk-mcp
AI 创建项目过程中,如果遇到文件夹访问权限问题,怎么解决?
如果遇到本地目录访问权限问题,建议使用管理员权限给目录赋予写权限。


MCP 工具生成的 userSig 登录失败,怎么办 ?
MCP 工具生成的 UserSig 登录失败,可能是因为在某些特定 IDE 下自动写入时字符被修改了,您可以让 AI 重新生成或者手动复制 UserSig 到代码中。