使用 JavaScript 生成命令机器人
Microsoft Teams 允许使用命令机器人自动执行重复任务。 它响应使用自适应卡片在聊天中发送的简单命令。
在本教程中,你将了解:
- 如何使用 Teams 工具包生成命令机器人。
- 关于应用的目录结构。
本分步指南可帮助你使用 Teams 工具包生成命令机器人。 可以看到以下输出:
先决条件
下面是生成和部署应用所需的工具列表。
安装 | 使用 | |
---|---|---|
必需 | ||
Visual Studio Code | JavaScript 或 TypeScript,生成环境。 使用最新版本。 | |
Teams 工具包 | Microsoft Visual Studio Code 扩展,用于为应用创建项目基架。 使用最新版本。 | |
Node.js | 后端 JavaScript 运行时环境。 有关详细信息,请参阅 项目类型的Node.js 版本兼容性表。 | |
Microsoft Teams | Microsoft Teams,在一个位置通过聊天、会议和通话应用与你合作的每个人协作。 | |
Microsoft Edge(推荐)或 Google Chrome | 包含开发人员工具的浏览器。 | |
Microsoft 365 开发人员帐户 | 具有安装应用的相应权限的 Teams 帐户的访问权限。 |
注意
本指南在 Teams 工具包最新版本和 Nodejs 版本 14 和 16 上进行了测试。 本指南中的步骤可能适用于其他版本,但尚未测试。
准备开发环境
安装所需的工具后,设置开发环境。
安装 Teams 工具包
Microsoft Teams 工具包通过为应用预配和部署云资源以及发布到 Teams 应用商店的工具来帮助简化开发过程。
可以将 Teams 工具包与 Visual Studio Code 或名为 TeamsFx CLI 的命令行界面配合使用。
打开 Visual Studio Code,选择“ 扩展 ” (Ctrl+Shift+X 或 “查看>扩展) ”。
在搜索框中,输入 Teams 工具包。
选择“安装”。
Teams 工具包 图标显示在 Visual Studio Code 活动栏中。
还可以从 Visual Studio Code Marketplace 安装 Teams 工具包。
设置 Teams 开发租户
租户是 Teams 中组织的空间或容器,可在其中聊天、共享文件和运行会议。 此空间也是上传和测试应用的位置。 让我们验证是否已准备好使用租户进行开发。
检查上传应用选项
创建自定义应用后,必须使用“上传自定义应用”选项将 应用上传到 Teams。 登录到 Microsoft 365 帐户,检查是否已启用此选项。
以下步骤可帮助你验证是否可以在 Teams 中上传应用:
在 Teams 客户端中,选择“ 应用” 图标。
选择“管理应用”。
选择 “上传应用”。
查找“ 上传自定义应用”选项。 如果选项可见,则可以上传自定义应用。
注意
如果找不到上传自定义应用的选项,请与 Teams 管理员联系。
创建免费的 Teams 开发人员租户 (可选)
如果没有 Teams 开发人员帐户,请加入 Microsoft 365 开发人员计划。
选择“ 立即加入 ”,然后按照屏幕上的说明进行操作。
在欢迎屏幕中,选择“ 设置 E5 订阅”。
设置管理员帐户。 完成后,将显示以下屏幕:
使用刚刚设置的管理员帐户登录到 Teams。 验证在 Teams 中是否具有 “上传自定义应用 ”选项。
生成命令机器人
使用 Visual Studio Code 生成命令机器人
打开 Visual Studio Code。
选择 Visual Studio Code 活动栏中的 Teams 工具包图标。
选择“ 创建新应用”。
选择“ 机器人 ”以创建新的机器人项目。
确保已选择 “聊天命令 ”作为要在应用中生成的应用功能。
选择 JavaScript 作为编程语言。
选择“ 默认文件夹 ”,将项目根文件夹存储在默认位置。
还可以通过以下步骤更改默认位置:
选择“ 浏览”。
选择项目工作区的位置。
选择 “选择文件夹”。
为应用输入合适的名称。
选择“Enter”。
创建应用后,Teams 工具包会显示以下消息:
命令机器人应用在几秒钟内创建。
从 Visual Studio Code 活动栏中选择“运行和调试”图标。
从下拉列表中选择“ 在 Teams (Edge) 中调试”或“在 Teams (Chrome) 中调试 ”。
选择“ 开始调试 ”按钮。 系统会提示将命令机器人应用上传到本地计算机上的 Teams。
选择“ 添加” 或使用下拉菜单将命令机器人应用添加到团队、聊天或会议。
选择 命令机器人。
选择“Enter”。
自适应卡中收到以下命令响应:
了解源代码
Teams 工具包提供用于生成应用的组件。 创建项目后,可以在 Visual Studio Code 的 “资源管理器” 区域中查看项目文件夹和文件。
如果选择使用 UI 框架,则以下示例模板代码提供了 React 组件的基架。 它包含以下内容:
文件夹/文件 | 目录 |
---|---|
teamsapp.yml |
主项目文件描述应用程序配置,并定义要在每个生命周期阶段运行的操作集。 |
teamsapp.local.yml |
这将替代 teamsapp.yml 启用本地执行和调试的操作。 |
env/ |
名称/值对存储在环境文件中,由 teamsapp.yml 用于自定义预配和部署规则。 |
.vscode/ |
用于调试的 VSCode 文件。 |
appPackage/ |
Teams 应用程序清单的模板。 |
infra/ |
用于预配 Azure 资源的模板。 |
src/ |
应用程序的源代码。 |
src/index.js |
命令和 restify 响应的应用程序入口点和处理程序。 |
src/teamsBot.js |
用于机器人自定义的空团队活动处理程序。 |
src/adaptiveCards/helloworldCommand.json |
发送到 Teams 的生成的自适应卡片。 |
src/helloworldCommandHandler.js |
用于处理命令的业务逻辑。 |
部署第一个 Teams 应用
你已了解如何使用命令机器人功能生成和运行 Teams 应用。 最后一步是在 Azure 上部署应用。
让我们使用 Teams 工具包在 Azure 上部署第一个具有命令机器人功能的应用。
登录到 Azure 帐户
使用帐户访问 Microsoft Azure 门户,并提供预配新的云资源来支持应用。
打开 Visual Studio Code。
打开创建命令机器人应用的项目文件夹。
选择边栏中的“Teams 工具包” 图标。
选择“使用凭据 登录到 Azure ”。
提示
如果已安装 AZURE 帐户扩展并使用相同的帐户,则可以跳过此步骤。
默认 Web 浏览器随即打开,以便登录帐户。
- 出现提示时关闭浏览器并返回到 Visual Studio Code。
边栏的 “帐户 ”部分分别显示这两个帐户。 它还列出了可用的 Azure 订阅数。 确保至少有一个可用的 Azure 订阅可用。 如果没有,请注销并使用其他帐户。
恭喜,你已创建 Teams 应用! 现在,让我们继续了解如何使用 Teams 工具包将其中一个应用部署到 Azure。
将应用部署到 Azure。
在 “部署 ”下,可以预配必要的云资源,并将应用的代码复制到创建的云资源中。
在 Visual Studio Code 边栏中选择 Teams 工具包 图标。
在“生命周期”下选择“预配”。
选择现有资源组或创建新资源组。 有关详细信息,请参阅 创建资源组。
注意
此时会显示一个对话框,指出在 Azure 中运行资源时可能会产生成本。
选择“ 预配”。
预配过程在 Azure 云中创建资源。 可以通过观察右下角的对话来监视进度。 几分钟后,会看到以下通知:
可以选择查看预配的资源。 在本教程中,无需查看资源。
在预配完成后,选择“生命周期”下的“部署”。
选择“部署”。
部署需要一些时间。 可以在右下角的对话框中监视进度。 几分钟后,会看到以下通知。
打开调试面板, (Ctrl+Shift+D / ⌘⇧-D 或查看 > Visual Studio Code 中的运行) 。
从启动配置下拉列表 中选择“在 Teams (Edge) 中启动远程”。
选择“ 开始调试 ”按钮。 系统会提示将命令机器人应用上传到 Teams。
选择“ 添加” 或使用下拉菜单将命令机器人应用添加到团队、聊天或会议。
选择 命令机器人。
选择“Enter”。
自适应卡中收到以下命令响应:
完成挑战
你想出了这样的东西吗?
恭喜!
你已完成生成命令响应应用的教程。
你有关于此部分的问题? 如果有,请向我们提供反馈,以便我们对此部分作出改进。