快速开始

通过这个教程，我们将创建一个 Agent，并在小程序页面上对接 Agent，实现调用 Agent 完成对话。

创建及配置 Agent

通过云开发的云后台，或者直接点击链接，进入AI+ 能力。

选择接入自定义 AI 能力后，将会进入 Agent 配置页面。

在 Agent 配置页面，选择新建 Agent，并选择使用模版新建。 这里我们可以选择“信达雅翻译”，并确认完成新建。

在完成创建后，我们从右侧列表可以看到新建的“信达雅翻译” Agent，并且点击后可以在主页面查看 Agent 的配置内容和测试窗口。

在测试窗口，我们可以测试 Agent 的交互能力，例如可以输入： 翻译“tencent cloud base”，然后查看 Agent 的回复。

Agent 的人设、开场白、问题等配置可以进一步调整和修改，调整方案可进一步探索和发现。

在 Agent 配置完成并保存后，通过上方 Agent 名称旁的复制按钮，获取到 Agent ID，用于后续的进一步开发对接。

小程序对接

完成 Agent 配置和保存后，我们就可以通过小程序的页面上增加输入输出组件，对接 Agent，达到智能对话的效果。

添加页面及组件

在小程序中新建一个页面，例如 agent 页面。

初始化 SDK

在小程序的 package.json 目录下，执行如下命令，按照所需要使用的 npm 包

npm i @cloudbase/js-sdk@2.8.3-beta.0

在页面的代码文件 agent.js 中，引入 SDK，并进行初始化，其中 cloudbase.init 中的 env 参数需要填写为 Agent 所在云开发环境的环境 ID：

src/App.vue

// 在开始之前，请确保完成配置了小程序 request 合法域名，详情请参考 https://docs.cloudbase.net/quick-start/baas/wx-mini
// 在小程序 package.json 所在的目录（一般是 miniprogram 目录）执行命令安装 npm 包：
// npm i @cloudbase/js-sdk@2.8.3-beta.0
// 安装完成后，点击微信开发者工具的菜单栏中「工具 -> 构建 npm」

// 引入 SDK，这里我们以分模块的形式按需引入了 cloudbase-js-sdk，也支持完整引入
import cloudbase from "@cloudbase/js-sdk/app";
import { registerAuth } from "@cloudbase/js-sdk/auth";
import { registerAi } from "@cloudbase/js-sdk/ai";

registerAuth(cloudbase);
registerAi(cloudbase);
const app = cloudbase.init({
  env: "your-env", // 需替换为实际使用环境 id
});
const auth = app.auth({ persistence: "local" });
await auth.signInWithOpenId(); // 或者使用其他登录方式
const ai = await app.ai();
// 接下来就可以调用 ai 模块提供的方法了

调用 Agent 方法并测试运行

在 agent.js 中，可以新增方法，并使用如下方式调用 Agent，其中调用参数中的 botId 参数，需要设置为我们在上面步骤中获取到的 Agent ID。

提示

Agent 对话以流式进行

const res = await ai.bot.sendMessage({
  botId: "botId-xxx",
  msg: "翻译一下‘tencent cloud base’",
});

for await (let str of res.textStream) {
  console.log(str);
}

通过加载页面时执行方法，查看日志中的运行输出，

对接页面

接下来，我们可以进一步通过在页面上增加对话展示窗口，以及输入窗口，对接 ai.bot.sendMessage 方法，以及输出内容，达到智能对话的效果。

当然，也可以尝试直接使用已经提供的 agent-ui 前端组件，进一步简化对接流程。