Создание расширения обмена сообщениями для Microsoft TeamsBuild a messaging extension for Microsoft Teams

Существует два типа расширений для обмена сообщениями в teams: команды поиска и команды действий.There are two types of Teams app messaging extensions : Search commands and action commands.

На этом занятии вы создадите команду поиска (также называемую расширением обмена сообщениями на основе поиска ), которая является ярлыком для поиска внешнего контента и предоставления общего доступа к ним в Teams.In this lesson, you'll create a search command (also known as a search-based messaging extension ), which is a shortcut for finding external content and sharing it in Teams. Пользователи могут получить доступ к командам поиска из поля "Создание команд" или "команда".Users can access search commands from the Teams compose or command box.

Ваше назначениеYour assignment

Служба технической поддержки организации взаимодействуют с пользователями в Teams, но эти билеты размещаются в отдельной системе.Your organization's help desk communicates with users through Teams, but the tickets reside in a separate system. Это означает, что сотрудники службы поддержки должны постоянно переходить между приложениями и перемещаться между ними.This means support staff must constantly go back and forth between apps. Вы узнаете, как можно уменьшить это большое количество контекстных переключений, создав простой модуль обмена сообщениями на основе поиска для Teams.You'll investigate how you might reduce this much context switching by creating a simple search-based messaging extension for Teams.

Что вы узнаетеWhat you'll learn

  • Создание проекта приложения и расширения обмена сообщениями Bot с помощью набора инструментов Microsoft Teams для Visual Studio CodeCreate an app project and messaging extension bot using the Microsoft Teams Toolkit for Visual Studio Code
  • Определите конфигурации приложений и некоторые шаблоны формирования шаблонов, относящиеся к расширениям обмена сообщениями.Identify the app configurations and some of the scaffolding relevant to messaging extensions
  • Локальное размещение приложенияHost an app locally
  • Настройка почтового робота для расширения обмена сообщениямиConfigure the bot for your messaging extension
  • Загрузка неопубликованных и тестирование расширения обмена сообщениями в TeamsSideload and test a messaging extension in Teams

Перед началом работыBefore you begin

Если вы еще не сделали это, убедитесь, что вы знаете и установите необходимые компоненты для разработки Teams.If you haven't yet, make sure you understand and install the Teams development prerequisites.

1. Создайте проект приложения.1. Create your app project

Набор средств Microsoft Teams позволяет настроить следующие компоненты для расширения системы обмена сообщениями:The Microsoft Teams Toolkit helps you set up the following components for your messaging extension:

  • Конфигурации приложений и формирование шаблонов, относящиеся к расширениям обмена сообщениямиApp configurations and scaffolding relevant to messaging extensions
  • Bot для расширения обмена сообщениями, автоматически регистрируемого в службе Microsoft Azure BotBot for your messaging extension that's automatically registered with the Microsoft Azure Bot Service

Совет

Если вы еще не создали проект приложения Teams, возможно, вам будет полезно выполнить приведенные выше инструкции по более подробному объяснению проектов.If you haven't created a Teams app project before, you might find it helpful to follow these instructions that explain projects in more detail.

  1. В Visual Studio Code выберите Microsoft Teams на левой панели активности и выберите создать приложение Teams.
  2. При появлении соответствующего запроса войдите в систему с помощью учетной записи разработчика Microsoft 365.When prompted, sign in with your Microsoft 365 development account.
  3. На экране добавить возможности выберите расширение системы обмена сообщениями , а затем нажмите Далее.On the Add capabilities screen, select Messaging Extension then Next.
  4. Введите имя приложения Teams.Enter a name for your Teams app. (Это имя приложения по умолчанию, а также имя каталога проекта приложения на локальном компьютере.)(This is the default name for your app and also the name of the app project directory on your local machine.)
  5. На экране Настройка расширения обмена сообщениями выполните следующие действия:On the Configure messaging extension screen, do the following:
    1. Выберите вариант только на основе поиска для типа расширения обмена сообщениями.Choose only the Search-based option for the type of messaging extension.
    2. Выберите создать новый Bot, а затем создайте регистрацию для ленты.Select Create a new Bot then Create Bot Registration. В случае успеха новый робот будет иметь зарегистрированное состояние.If successful, your new bot will have a Registered status.
    3. Пока нажмите кнопку нет для параметра link унфурлинг.For now, select No for the link unfurling option.
  6. В нижней части экрана нажмите кнопку Готово , чтобы настроить проект.Select Finish at the bottom of the screen to configure your project.

2. определение соответствующих компонентов проекта приложения2. Identify relevant app project components

Многие конфигурации приложений и формирование шаблонов настраиваются автоматически при создании проекта с помощью набора инструментов Teams.Much of the app configurations and scaffolding are set up automatically when you create your project with the Teams Toolkit.

Конфигурации приложенийApp configurations

Чтобы просмотреть или изменить конфигурации расширения системы обмена сообщениями, выберите app Studio в наборе инструментов и перейдите к разделу расширения обмена сообщениями.To view or update your messaging extension's configurations, select App Studio in the toolkit and go to Messaging extensions.

Формирование шаблонов приложенийApp scaffolding

Формирование шаблонов приложений предоставляет botActivityHandler.js файл, расположенный в корневом каталоге проекта, для обработки того, как расширение системы обмена сообщениями (или техническим процессом messaging extension's bot) реагирует на поисковые запросы в Teams.The app scaffolding provides a botActivityHandler.js file, located in the root directory of your project, for handling how your messaging extension (or technically, the messaging extension's bot) responds to search queries in Teams.

3. Настройка безопасного туннеля для приложения3. Set up a secure tunnel to your app

В целях тестирования давайте разместите расширение обмена сообщениями на локальном веб-сервере (порт 3978).For testing purposes, let's host your messaging extension on a local web server (port 3978).

  1. Если вы еще не сделали это, установите ngrok.If you haven't already, install ngrok.
  2. В терминале запустите ngrok http -host-header=rewrite 3978 .In a terminal, run ngrok http -host-header=rewrite 3978.
  3. Скопируйте URL-адрес HTTPS в выходных данных (например, https://468b9ab725e9.ngrok.io ), так как для Teams необходимы HTTPS-подключения.Copy the HTTPS URL in the output (for example, https://468b9ab725e9.ngrok.io) since Teams requires HTTPS connections.

При использовании этого URL-адреса Teams (для которых требуются HTTPS-подключения) смогут подключаться к месту размещения приложения ( localhost на порте 3978).With this URL, Teams (which requires HTTPS connections) will be able tunnel to where you're hosting your app (localhost on port 3978).

4. Настройка Bot для расширения обмена сообщениями4. Configure the bot for your messaging extension

Расширения обмена сообщениями основываются на боты для отправки и обработки запросов пользователей из Teams в размещенную службу.Messaging extensions rely on bots to send and process user requests from Teams to your hosted service. Робот должен быть зарегистрирован в службе Azure Bot, которая была выполнена при настройке приложения с помощью набора инструментов Teams.The bot must be registered with the Azure Bot Service, which was done when you set up your app using the Teams Toolkit.

По-прежнему необходимо указать URL-адрес конечной точки Bot для получения и обработки поисковых запросов в вашем расширении системы обмена сообщениями.You still must specify a bot endpoint URL to receive and process search queries in your messaging extension. Как правило, URL-адрес выглядит так https://HOST_URL/api/messages :Typically, the URL looks like https://HOST_URL/api/messages. Вы можете быстро настроить его в наборе инструментов.You can configure this quickly in the toolkit.

  1. В Visual Studio Code выберите Microsoft Teams на левой панели действий, а затем выберите пункт Открыть набор средств Microsoft Teams.
  2. Перейдите в боты > существующие регистрации Bot и выберите робот, созданный во время установки.Go to Bots > Existing bot registrations and select the bot you created during setup.
  3. В поле адрес конечной точки Bot введите URL-адрес ngrok (например,), на https://468b9ab725e9.ngrok.io котором размещается Bot и добавьте /api/messages к нему.In the Bot endpoint address field, enter the ngrok URL (for example, https://468b9ab725e9.ngrok.io) where you're hosting the bot and append /api/messages to it.

Ваш робот сможет обрабатывать запросы в вашем расширении системы обмена сообщениями.Your bot will be able to handle queries in your messaging extension.

5. Построение и запуск приложения5. Build and run your app

Вы настроили URL-адрес для размещения своего расширения обмена сообщениями и настройки его для обработки запросов поиска.You've set up a URL to host your messaging extension and configured it to handle searches. Самое время заставить ваше приложение работать и работать.It's time to get your app up and running.

  1. В терминале перейдите к корневому каталогу проекта приложения и запустите его npm install .In a terminal, go to the root directory of your app project and run npm install.
  2. Выполните команду npm start .Run npm start.

В случае успеха появится следующее сообщение о том, что служба расширения обмена сообщениями прослушивает действия в localhost :If successful, you see the following message indicating your messaging extension service is listening for activity at your localhost:

Bot/ME service listening at http://localhost:3978

6. Загрузка неопубликованных своего расширения обмена сообщениями в Teams6. Sideload your messaging extension in Teams

Если ваш модуль обмена сообщениями работает, вы можете установить его в Teams.With your messaging extension running, you can install it in Teams.

Совет

Если вы еще не неопубликованные приложение Teams до и не выпустили проблемы, выполните указанные ниже действия.If you haven't sideloaded a Teams app before and run into issues, follow these instructions.

  1. В Visual Studio Code нажмите клавишу F5 , чтобы запустить веб-клиент Teams.In Visual Studio Code, press the F5 key to launch a Teams web client.
  2. В диалоговом окне Установка приложения нажмите кнопку " Добавить ".In the app install dialog, select Add for me.

7. Тестирование расширения системы обмена сообщениями7. Test your messaging extension

Узнайте, как работают расширения обмена сообщениями в чате Teams.Learn how messaging extensions work in a Teams chat.

  1. Начните новый сеанс разговора.Start a new chat. В поле Создание нажмите кнопку Дополнительно и выберите приложение расширения обмена сообщениями, которое вы только что неопубликованные.
  2. Попробуйте выполнить поиск чего-либо (например, билетов ).Try searching for something (for example, Tickets ). Если ваше приложение работает, вы увидите пример результатов поиска (вы можете добавить его позже).If your app is working, you'll see sample search results (you can add your own later).
    Снимок экрана, демонстрирующий использование расширения обмена сообщениями на основе поиска в поле _OL_QUOTE_PLACEHOLDER_Создание Teams_OL_QUOTE_PLACEHOLDER_.

ПрекрасноWell done

Поздравляем!Congratulations! У вас есть основные расширения системы обмена сообщениями Teams, которые задают поиск внешнего контента в поле "создать" или "команда".You have a basic Teams messaging extension that's set up to search for external content in the compose or command box.

Дальнейшие действияNext steps

Чтобы продолжить и создать полнофункциональное расширение системы обмена сообщениями, ознакомьтесь со следующими страницами:See the following pages to continue and build a fully featured messaging extension:

  1. Определите команды поиска , связанные со службой.Define search commands that are relevant to your service.
  2. Настройте службу для реагирования на поиск пользователей.Configure your service to respond to users' searches.

Устранение неполадокTroubleshooting

Приведенные ниже сведения помогут вам устранить проблемы, связанные с выполнением этого руководства.The following information may help if you had issues completing this tutorial.

Bot не подключены к TeamsBot isn't connected to Teams

Если вы установили приложение, но оно не работает, убедитесь, что линия канала для расширения обмена сообщениями подключена к каналу команд службы Azure Bot.If you installed your app but it isn't working, make sure the messaging extension's bot is connected to the Azure Bot Service's Teams channel.

Важно понимать, что это не то же самое, что и канал в Teams.It's important to understand that this isn't the same as a channel in Teams. В этом случае каналом является способ подключения службы Azure Bot к Teams или другому поддерживаемому Microsoft или стороннему приложению для общения.In this case, a channel is how the Azure Bot Service connects your bot to Teams or another supported Microsoft or third-party communications app.

ПодробнееLearn more