使用 Teams AI 库和 Teams 工具包生成自定义引擎代理
你可以为 Microsoft Teams 创建自定义引擎代理,以精确控制轻型作。 这展示了语言模型在准确理解和执行用户意向方面的有效性,使其与应用作保持一致。
在本教程中,你将了解:
- 如何使用 Teams 工具包设置新项目。
- 如何导入 Teams AI 库功能。
- 如何在 Teams 中部署自定义引擎代理并控制轻型作。
可以看到以下输出:
先决条件
下面是生成和部署自定义引擎代理所需的工具列表。
安装 | 用于使用... | |
---|---|---|
Teams 工具包 | Microsoft Visual Studio Code扩展,用于为应用创建项目基架。 使用最新版本。 | |
Microsoft Teams | 若要与所有人协作,可以在一个位置使用用于聊天、会议和通话的应用。 | |
Node.js | 后端 JavaScript 运行时环境。 有关详细信息,请参阅 项目类型的Node.js 版本兼容性表。 | |
Microsoft Edge(推荐)或 Google Chrome | 包含开发人员工具的浏览器。 | |
Visual Studio Code | JavaScript、TypeScript 和 Python 生成环境。 使用最新版本。 | |
OpenAI 或 Azure OpenAI | 首先创建 OpenAI API 密钥以使用 OpenAI 的 GPT。 如果要在 Azure Microsoft托管应用或访问资源,则必须在开始之前创建 Azure OpenAI 服务 。 | |
Microsoft 365 开发人员帐户 | 具有安装应用的相应权限的 Teams 帐户的访问权限。 |
准备开发环境
安装所需的工具后,设置开发环境。
安装 Teams 工具包
Teams 工具包使用工具为应用预配和部署云资源、发布到 Teams 应用商店等,帮助简化开发过程。
可以将工具包与Visual Studio Code配合使用。
还可以使用 CLI (命令行接口) ,称为 teamsapp
。
打开Visual Studio Code并选择“扩展”视图, (Ctrl+Shift+X / ⌘⇧-X 或“查看>扩展”) 。
在搜索框中,输入 Teams 工具包。
选择 Teams 工具包旁边的 “安装 ”。
安装后,Teams 工具包图标将显示在Visual Studio Code活动栏中。
还可以在Visual Studio Code市场中找到 Teams 工具包。
设置 Teams 开发租户
租户类似于 Teams 中组织的空间或容器,可在其中聊天、共享文件和运行会议。 此空间也是上传和测试自定义应用的位置。 让我们验证是否已准备好使用租户进行开发。
检查自定义应用上传选项
创建应用后,必须在 Teams 中加载应用,而无需分发它。 此过程称为自定义应用上传。 登录到 Microsoft 365 帐户以查看此选项。
注意
自定义应用上传对于在 Teams 本地环境中预览和测试应用是必需的。 如果未启用,则无法在 Teams 本地环境中预览和测试应用。
是否已拥有租户,并且是否具有管理员访问权限? 我们来检查,如果你真的这样做了!
验证是否可以在 Teams 中上传自定义应用:
在 Teams 客户端中,选择“ 应用” 图标。
选择“管理应用”。
选择 “上传应用”。
查找“ 上传自定义应用”选项。 如果看到 选项,则表示已启用自定义应用上传。
注意
如果找不到上传自定义应用的选项,请与 Teams 管理员联系。
创建免费的 Teams 开发人员租户 (可选)
如果没有 Teams 开发人员帐户,可以免费获取它。 加入 Microsoft 365 开发人员计划!
选择“ 立即加入 ”,然后按照屏幕上的说明进行作。
在欢迎屏幕中,选择“ 设置 E5 订阅”。
设置管理员帐户。 完成后,将显示以下屏幕。
使用刚刚设置的管理员帐户登录到 Teams。 验证在 Teams 中是否具有 “上传自定义应用 ”选项。
获取免费的 Azure 帐户
如果要在 Azure 中托管应用或访问资源,则必须拥有 Azure 订阅。 在开始之前创建一个免费帐户。
现在,你已准备好设置帐户的所有工具。 开发环境已准备好开始生成应用项目。
为自定义引擎代理应用创建项目工作区
让我们创建第一个自定义引擎代理应用。
Teams 应用的自定义引擎代理功能可创建 AI 聊天机器人。 使用它来运行简单的自动化任务,例如,提供客户服务。 自定义引擎代理与 Web 服务通信,并帮助你使用其产品/服务。 可以获取天气预报、进行预订或使用自定义引擎代理提供的任何其他服务。
由于已准备好创建应用或自定义引擎代理,因此可以设置用于创建自定义引擎代理的新 Teams 项目。
在本教程中,你将了解:
创建自定义引擎代理项目工作区
如果先决条件已到位,让我们开始吧!
打开 Visual Studio Code。
选择“Visual Studio Code活动栏中的 Teams 工具包
”图标。
选择“ 创建新应用”。
选择“ 自定义引擎代理”。
选择“ 基本 AI 聊天机器人”。
选择“ TypeScript ”作为编程语言。
选择 “OpenAI ”或 “Azure OpenAI”。
输入 OpenAI 密钥 或 Azure OpenAI 密钥和 Azure OpenAI 终结点。
选择“ 默认文件夹 ”,将项目根文件夹存储在默认位置。
还可以通过以下步骤更改默认位置:
选择“ 浏览”。
选择项目工作区的位置。
选择 “选择文件夹”。
为应用输入合适的名称 ,然后选择 Enter。
此时会显示一个对话框。 根据你的要求,选择“ 是,我信任作者 ”或“ 否,我不信任作者 ”。
自定义引擎代理将在几秒钟内创建。
创建应用后,Teams 工具包会显示以下消息:
快速回顾如何创建 Teams 应用。
观看此简短回顾,了解如何创建 Teams 应用。
浏览应用源代码
基架完成后,在 Visual Studio Code 的“资源管理器”区域中查看项目目录和文件。
文件夹名 | 目录 |
---|---|
env/.env.local.user |
用于 teamsapp.yml 自定义预配和部署规则的本地环境的配置文件。 |
index.ts |
应用的主入口点。 |
teamsBot.ts |
Teams 活动处理程序。 |
appPackage |
应用清单模板文件和应用图标 (color.png 和 outline.png) 。 |
appPackage/manifest.json |
用于在本地和远程环境中运行应用的应用清单。 |
config.ts |
config.ts 包装对用于设置机器人适配器的环境变量的访问权限。 |
teamsapp.yml |
这是定义属性和配置阶段定义的main Teams 工具包项目。 |
teamsapp.local.yml |
这将使用启用本地执行和调试的作替代teamsapp.yml。 |
生成并运行第一个自定义引擎代理
使用 Teams 工具包设置项目工作区后,生成项目。 确保已登录到 Microsoft 365 帐户。
登录到 Microsoft 365 帐户
使用此帐户登录到 Teams。 如果使用 Microsoft 365 开发人员计划租户,则注册时设置的管理员帐户是 Microsoft 365 帐户。
打开 Visual Studio Code。
选择边栏中的“Teams 工具包”
图标。
选择“ 登录到 M365”。
此时会打开默认 Web 浏览器,以便登录帐户。
使用凭据登录到 Microsoft 365 帐户。
出现提示时关闭浏览器并返回到Visual Studio Code。
返回到 Visual Studio Code 内的 Teams 工具包。
使用此帐户登录到 Teams。 如果使用 Microsoft 365 开发人员计划租户,则注册时设置的管理员帐户是 Microsoft 365 帐户。
现在,你已准备好生成应用并在本地运行它!
使用 Teams AI 库功能更新自定义引擎代理
Teams 工具包是搭建基架并运行自定义引擎代理的最简单方法。 Teams 工具包创建基本结构,以便你开始配置自定义引擎代理。
让我们开始配置 Teams AI 库功能:
转到Visual Studio Code并打开终端窗口。
在终端中运行以下命令以安装
yarn
:npm install npm install @microsoft/teams-ai
注意
如果要通过 Teams 工具包创建示例,则会
.env.local.user
在自动创建的安装程序中找到文件。 如果文件不可用,请创建文件并.env.local.user
更新 OpenAI 密钥或 Azure OpenAI 密钥和 Azure OpenAI 终结点。转到
app.ts
文件:将 添加到
TurnContext
import 语句,如下所示:import { MemoryStorage, TurnContext} from 'botbuilder';
将 添加到
DefaultConversationState, Memory, TurnState
import 语句,"@microsoft/teams-ai"
如下所示:// See https://aka.ms/teams-ai-library to learn more about the Teams AI library. import { Application, ActionPlanner, DefaultConversationState, Memory, TurnState, OpenAIModel, PromptManager } from "@microsoft/teams-ai";
在“@microsoft/teams-ai”后面添加以下内容:
// eslint-disable-next-line @typescript-eslint/no-empty-interface interface ConversationState extends DefaultConversationState { lightsOn: boolean; } type ApplicationTurnState = TurnState<ConversationState>; if (!process.env.OPENAI_API_KEY) { throw new Error('Missing environment variables - please check that OPENAI_KEY or AZURE_OPENAI_KEY is set.'); }
在 之后
Define storage and application code
,添加以下内容:// Define a prompt function for getting the current status of the lights planner.prompts.addFunction('getLightStatus', async (context: TurnContext, memory: Memory) => { return memory.getValue('conversation.lightsOn') ? 'on' : 'off'; });
在 之后
return memory.getValue('conversation.lightsOn') ? 'on' : 'off';
,添加以下内容:// Register action handlers app.ai.action('LightsOn', async (context: TurnContext, state: ApplicationTurnState) => { state.conversation.lightsOn = true; await context.sendActivity(`[lights on]`); return `the lights are now on`; }); app.ai.action('LightsOff', async (context: TurnContext, state: ApplicationTurnState) => { state.conversation.lightsOn = false; await context.sendActivity(`[lights off]`); return `the lights are now off`; }); interface PauseParameters { time: number; } app.ai.action('Pause', async (context: TurnContext, state: ApplicationTurnState, parameters: PauseParameters) => { await context.sendActivity(`[pausing for ${parameters.time / 1000} seconds]`); await new Promise((resolve) => setTimeout(resolve, parameters.time)); return `done pausing`; });
转到
adapter.ts
文件:在 下
Import required bot services.
,删除现有代码并更新以下内容:// Import required bot services. // See https://aka.ms/bot-services to learn more about the different parts of a bot. import { TeamsAdapter } from '@microsoft/teams-ai'; import { ConfigurationServiceClientCredentialFactory } from 'botbuilder';
在 下
This bot's main dialog.
删除以下代码:// This bot's main dialog. import config from "./config"; const botFrameworkAuthentication = new ConfigurationBotFrameworkAuthentication( {}, new ConfigurationServiceClientCredentialFactory(config) );
在 之后
import { ConfigurationServiceClientCredentialFactory } from 'botbuilder';
,将 下面的Create adapter.
代码替换为以下内容:// Create adapter. // See https://aka.ms/about-bot-adapter to learn more about how bots work. const adapter = new TeamsAdapter( {}, new ConfigurationServiceClientCredentialFactory({ MicrosoftAppId: process.env.BOT_ID, MicrosoftAppPassword: process.env.BOT_PASSWORD, MicrosoftAppType: 'MultiTenant' }) );
转到
index.ts
文件:在 中
Create HTTP server.
,\n机器人启动后console.log(
,${server.name} 侦听 ${server.url});
添加以下内容:console.log('\nGet Bot Framework Emulator: https://aka.ms/botframework-emulator'); console.log('\nTo test your bot in Teams, sideload the app manifest.json within Teams Apps.');
在根文件夹中,创建新的文件夹结构: 提示>序列。
在 “顺序”下,创建以下文件:
- config.json
- skprompt.txt
- actions.json
转到 文件并
config.json
添加以下代码以创建提示模型设置:{ "schema": 1.1, "description": "A bot that can turn the lights on and off", "type": "completion", "completion": { "model": "gpt-3.5-turbo", "completion_type": "chat", "include_history": true, "include_input": true, "max_input_tokens": 2800, "max_tokens": 1000, "temperature": 0.2, "top_p": 0.0, "presence_penalty": 0.6, "frequency_penalty": 0.0, "stop_sequences": [] }, "augmentation": { "augmentation_type": "sequence" } }
自定义引擎代理使用 OpenAI 或 Azure OpenAI 进行自然语言建模。 该文件
config.json
处理自定义引擎代理的语言处理。 此文件由PromptManager
index.ts
文件中的 启动,负责监督代理的语言处理。 启动提示时,提示管理器 (序列/config.json) 搜索提示配置文件,并将提示设置传递给 OpenAI 或 Azure OpenAI。转到
skprompt.txt
文件。 为 OpenAI 或 Azure OpenAI 添加以下说明,以便进行和简化对话:The following is a conversation with an AI assistant. The assistant can turn a light on or off. context: The lights are currently {{getLightStatus}}.
该文件
skprompt.txt
包含用户与 OpenAI 或 Azure OpenAI 交互的文本提示。 OpenAI 或 Azure OpenAI 尝试使用这些提示生成最有可能从上一个文本中遵循的下一系列字词。转到
actions.json
文件。 添加以下代码以定义自定义引擎代理的作:{ { "name": "LightsOn", "description": "Turn the lights on", "parameters": [] }, { "name": "LightsOff", "description": "Turn the lights off", "parameters": [] }, { "name": "Pause", "description": "Delays for a period of time", "parameters": { "type": "object", "properties": { "time": { "type": "number", "description": "The amount of time to delay in milliseconds" } }, "required": [ "time" ] } } }
该文件
actions.json
包含自定义引擎代理可以执行的作。ActionPlanner
文件中的index.ts
使用文件中actions.json
定义的作来执行作。
此示例使用 OpenAI 或 Azure OpenAI 进行其所有自然语言建模,用户可以使用其选择的任何语言与自定义引擎代理通信。 自定义引擎代理无需额外代码即可正确理解和响应。
在本地生成并运行自定义引擎代理
若要在本地环境中生成和运行应用,请执行以下作:
选择 F5 键以在调试模式下运行应用。
注意
如果 Teams 工具包无法检查特定的先决条件,则会提示你检查。
了解在调试器中本地运行应用时会发生什么情况。
如果你想知道,当你按 F5 键时,Teams 工具包:
- 检查以下所有先决条件:
- 你使用 Microsoft 365 帐户登录。
- 已为 Microsoft 365 帐户启用自定义应用上传。
- 支持安装 Node.js 版本。
- 机器人应用所需的端口可用。
- 安装 npm 包。
- 启动开发隧道以创建 HTTP 隧道。
- 在 Microsoft Entra ID 中注册应用并配置应用。
- 在 Bot Framework SDK 中注册应用并配置应用。
- 在 Teams 开发人员门户中注册应用并配置应用。
- 启动应用。
- 在 Web 浏览器中启动 Teams 并上传应用。
注意
首次运行应用时,将下载所有依赖项并生成应用。 编译完成后,将自动打开浏览器窗口。 此过程可能需要 3 到 5 分钟才能完成。
Teams 在 Web 浏览器中运行你的应用。
如果出现提示,请使用 Microsoft 365 帐户登录。
当系统提示将应用上传到本地计算机上的 Teams 时,选择“ 添加 ”。
现在,自定义引擎代理已在 Teams 上成功运行! 加载应用后,将打开与自定义引擎代理的聊天会话。
可以键入
LightsOn
以开始与自定义引擎代理交互。
了解如何排查应用未在本地运行的问题。
若要在 Teams 中成功运行应用,请确保已在 Teams 帐户中启用自定义应用上传。 可以在先决条件部分了解有关自定义应用上传的详细信息。
重要
在 政府社区云 (GCC) 、GCC-High 和国防部 (DOD) 环境中提供上传自定义应用。
提示
使用应用 验证工具在上传自定义应用之前检查问题。 此工具包含在工具包中。 修复错误以上传应用。
部署自定义引擎代理
你已了解如何创建、生成和运行自定义引擎代理。 最后一步是在 Azure 上部署应用。
让我们使用 Teams 工具包在 Azure 上部署自定义引擎代理。
登录到 Azure 帐户
使用此帐户访问Microsoft Azure 门户并预配新的云资源以支持你的应用。
打开 Visual Studio Code。
打开在其中创建了应用的项目文件夹。
选择边栏中的“Teams 工具包”
图标。
选择“ 登录到 Azure”。
提示
如果已安装 Azure 帐户扩展并使用相同的帐户,则可以跳过此步骤。 使用与其他扩展中使用的帐户相同的帐户。
此时会打开默认 Web 浏览器,以便登录帐户。
使用凭据登录到 Azure 帐户。
出现提示时关闭浏览器并返回到Visual Studio Code。
边栏中的 “帐户 ”部分分别显示这两个帐户。 它还列出了可用的 Azure 订阅数。 确保至少有一个可用的 Azure 订阅可用。 如果没有,请注销并使用其他帐户。
现在可以将应用部署到 Azure 了!
恭喜,你已创建自定义引擎代理!
将应用部署到 Azure。
部署包括两个步骤。 首先, (也称为预配) 创建必要的云资源。 然后,应用的代码将复制到创建的云资源中。 在本教程中,你将部署自定义引擎代理。
预配和部署之间有什么区别?
预配步骤在 Azure 中创建资源,Microsoft 365 为应用创建资源,但不会将 HTML、CSS、JavaScript) (代码复制到资源。 部署步骤将应用的代码复制到预配步骤期间创建的资源。 无需预配新资源即可多次部署,这很常见。 由于预配步骤可能需要一些时间才能完成,因此它与部署步骤是分开的。
在 Visual Studio Code 边栏中选择 Teams 工具包 图标。
选择“ 预配”。
选择要用于 Azure 资源的订阅。
应用是使用 Azure 资源托管的。
对话框警告你在 Azure 中运行资源时可能会产生成本。
选择“ 预配”。
预配过程在 Azure 云中创建资源。 这可能需要一些时间。 可以通过观看右下角的对话来监视进度。 几分钟后,会看到以下通知:
如果需要,可以查看预配的资源。 在本教程中,无需查看资源。
预配的资源将显示在 “环境 ”部分中。
预配完成后,从生命周期面板中选择“部署”。
与预配一样,部署需要一些时间。 可以通过观看右下角的对话来监视该过程。 几分钟后,你将看到完成通知。
现在,可以使用同一过程将自定义引擎代理部署到 Azure。
运行已部署的应用
完成预配和部署步骤后:
(Ctrl+Shift+D / ⌘⇧-D 或查看>Visual Studio Code的运行) ,打开调试面板。
从启动配置下拉列表中选择“ 启动远程 (Edge) ”。
选择“ 开始调试 (F5) 从 Azure 启动应用。
选择“添加”。
工具包显示一条消息,指示应用已添加到 Teams。
你的应用在 Teams 客户端上加载。
了解将应用部署到 Azure 时发生的情况
部署之前,应用程序已在本地运行:
- 后端使用 Azure Functions Core Tools 运行。
- 应用程序 HTTP 终结点 (Microsoft Teams 在此加载应用程序) 在本地运行。
部署是一个两步过程。 在活动 Azure 订阅上预配资源,然后将应用程序的后端和前端代码部署或上传到 Azure。
- 后端(如果已配置)使用各种 Azure 服务,包括Azure 应用服务和 Azure 存储。
- 前端应用程序部署到为静态 Web 托管配置的 Azure 存储帐户。
部署之前,应用程序已在本地运行:
- 后端使用 Azure Functions Core Tools 运行。
- 应用程序 HTTP 终结点 (Microsoft Teams 在此加载应用程序) 在本地运行。
部署是一个两步过程。 在活动 Azure 订阅上预配资源,然后将应用程序的后端和前端代码部署或上传到 Azure。
- 后端(如果已配置)使用各种 Azure 服务,包括Azure 应用服务和 Azure 存储。
- 前端应用程序部署到为静态 Web 托管配置的 Azure 存储帐户。
恭喜!
你做到了!
你已创建用于控制灯光的自定义引擎代理。
你已完成本教程。
你有关于此部分的问题? 如果有,请向我们提供反馈,以便我们对此部分作出改进。