Учебники

В этой статье вы узнаете больше о создании возможностей приложения Teams. Ниже приведен список пошаговых руководств, доступных для возможностей платформы Teams.

# Возможность Пошаговое руководство
1. Бот - Отладка чат-бота ИИ с помощью игровой площадки для агентов Microsoft 365
- Отправка упреждающих сообщений
2. Расширение для сообщений - Создание расширения для обмена сообщениями на основе API
- Создание расширения сообщений на основе действий
- Создайте свое первое приложение расширения сообщений на JavaScript
3. TAB Создайте свое первое приложение с вкладками с помощью клавиш C sharp
4. Единый вход. - Создание бота с проверкой подлинности с единым входом
- Добавление единого входа на вкладку и в приложение для расширения сообщений

Создайте свое первое приложение-бот

Начните разработку приложений для Microsoft Teams с вашего первого приложения Teams. Вы можете создать приложение бота для Teams с помощью JavaScript.


Создание первого бота

У вашего приложения есть возможность с собственным пользовательским интерфейсом и UX:

На схеме показано три функции этого приложения.

В этом руководстве вы узнаете:

  • Настройка нового проекта с помощью набора средств агентов Microsoft 365 (ранее известного как набор инструментов Teams).
  • Как создать приложение бота.
  • Развертывание приложения.

Необходимые условия

Убедитесь, что вы установили следующие инструменты для создания и развертывания приложений.

  Установка Для использования...
Обязательно    
  Набор средств для агентов Microsoft 365 Расширение Microsoft Visual Studio Code, создающее шаблоны проекта для вашего приложения. Используйте последнюю версию.
  Microsoft Teams Microsoft Teams для совместной работы со всеми, с кем вы работаете, с помощью приложений для чата, собраний и звонков в одном месте.
  Node.js Внутренняя среда выполнения JavaScript. Дополнительные сведения см. Node.js таблице совместимости версий для типа проекта.
  Microsoft Edge (рекомендуется) или Google Chrome Браузер со средствами разработчика.
  Visual Studio Code Среды сборки JavaScript, TypeScript или SharePoint Framework (SPFx). Используйте последнюю версию.
Необязательное    
  Инструменты Azure для Visual Studio Code и интерфейс командной строки Azure Инструменты Azure для доступа к хранимым данным или для развертывания облачной серверной части для приложения Teams в Azure.
  Инструменты разработчика React для Chrome ИЛИ инструменты разработчика React для Microsoft Edge Расширение DevTools для библиотеки JavaScript React с открытым кодом.
  Обозреватель Microsoft Graph Microsoft Graph Обозреватель — это браузерное средство, позволяющее выполнять запросы на основе данных Microsoft Graph.
  Портал разработчика для Teams Веб-портал для настройки, управления и публикации приложения Teams, в том числе в вашей организации или в магазине Microsoft Teams.

Совет

Если вы работаете с данными Microsoft Graph, вам следует ознакомиться с обозревателем Microsoft Graph и добавить его в закладки. Это браузерное средство позволяет выполнять запросы в Microsoft Graph вне приложения.

Настройка предварительных условий

После установки необходимых средств настройте среду разработки.

Установка набора средств агентов Microsoft 365

Набор средств для агентов Microsoft 365 (ранее известный как Teams Toolkit) помогает упростить процесс разработки с помощью инструментов подготовки и развертывания облачных ресурсов для приложения и публикации в магазине Teams.

Вы можете использовать Agents Toolkit с Visual Studio Code или интерфейсом командной строки под названием Microsoft 365 Agents Toolkit CLI (ранее известный как TeamsFx CLI).

  1. Откройте Visual Studio Code и выберите расширения (CTRL+SHIFT+X или просмотр>расширений).

  2. В поле поиска введите Microsoft 365 Agents Toolkit.

  3. Выберите Установить.

    Снимок экрана: установка расширения набора средств для агентов.

    Значок набора средств агентов Microsoft 365 появится на панели действий Visual Studio Code.

Вы также можете установить набор средств агентов из магазина Visual Studio Code Marketplace.

Настройка клиента разработки для Teams

Клиент — это пространство или контейнер для вашей организации в Teams, где вы общаетесь, обмениваетесь файлами и проводите собрания. В этом же пространстве можно отправить и протестировать свое приложение. Давайте проверим, готовы ли вы разрабатывать вместе с клиентом.

Проверка параметра "Загрузить приложение"

После создания пользовательского приложения необходимо отправить его в Teams с помощью параметра Загрузить пользовательское приложение . Войдите в свою учетную запись Microsoft 365, чтобы выполнить проверку, включен ли этот параметр.

Следующие шаги помогут вам проверить, можете ли вы отправлять приложения в Teams:

  1. В клиенте Teams выберите значок "Приложения ".

  2. Выберите "Управление приложениями".

  3. Выберите "Отправить приложение".

  4. Найдите параметр для отправки пользовательского приложения. Если параметр отображается, вы можете отправить пользовательские приложения.

    Снимок экрана показывает параметр для отправки пользовательского приложения в Teams.

Примечание

Если вы не находите возможности отправить пользовательское приложение, обратитесь к администратору Teams.

Создание бесплатного клиента для разработчиков Teams

Если у вас нет учетной записи разработчика Teams, присоединяйтесь к программе разработчиков Microsoft 365. Это действие не является обязательным.

  1. Перейдите в программу для разработчиков Microsoft 365.

  2. Выберите "Присоединиться сейчас" и следуйте инструкциям на экране.

  3. На экране приветствия выберите "Настроить подписку E5".

  4. Настройте учетную запись администратора. После завершения появится следующий экран:

    На снимке экрана показана программа для разработчиков Microsoft 365.

  5. Войдите в Teams с помощью только что настроенной учетной записи администратора. Убедитесь, что в Teams есть параметр "Отправить пользовательское приложение ".

Получите бесплатную учетную запись Azure

Если вы хотите разместить приложение или получить доступ к ресурсам в Azure, у вас должна быть подписка на Azure. Создайте бесплатную учетную запись , прежде чем начать.

Теперь у вас есть все инструменты для настройки учетной записи. Далее давайте настроим вашу среду разработки и начнем создавать! Сначала выберите приложение, которое нужно создать.

Создайте рабочую область Project для приложения бота

Давайте создадим ваше первое приложение-бот.

Функция бота приложения Teams создает чат-бота или бота для бесед. Вы используете его для выполнения простых и автоматизированных задач, таких как обслуживание клиентов. Бот общается с веб-службой и помогает вам использовать ее предложения. Вы можете получить прогноз погоды, забронировать столик или любую другую услугу, предложенную с помощью разговорного бота.

Схема, показывающая, что это приложение имеет три функции. Бот выделен.

Поскольку вы уже подготовились к созданию этих приложений, вы можете настроить новый проект Teams для создания приложения-бота.

В этом руководстве вы узнаете:

  1. Настройка нового проекта бота с помощью набора средств агентов.
  2. О структуре каталогов проекта приложения.

Важно

Боты доступны в облаках сообщества для государственных организаций (GCC), GCC High, Министерства обороны (DoD) и Teams, управляемых средами 21Vianet .

Создайте рабочую область проекта бота

Если все необходимые условия соблюдены, давайте начнем!

Примечание

Отображаемый пользовательский интерфейс Visual Studio Code взят из Mac. Она может отличаться в зависимости от операционной системы, версии набора средств агентов и среды.

  1. Откройте Visual Studio Code.

  2. Выберите значок набора средств для агентов Microsoft 365 на панели действий Visual Studio Code.

  3. Выберите "Создать агент или приложение>"приложения Teams.

    На этом снимке экрана показано расположение ссылки

  4. Выберите "Бот", чтобы создать новый проект бота.

    Снимок экрана: мастер создания проекта.

  5. Выберите базовый бот в качестве функции приложения, которую вы хотите добавить в свое приложение.

    На снимке экрана показана функция приложения, которую можно добавить в ваше новое приложение.

  6. Выберите JavaScript в качестве языка программирования.

    На снимке экрана показан вариант выбора языка программирования.

  7. Выберите папку по умолчанию для сохранения корневой папки проекта в папке по умолчанию.

    На снимке экрана показано выбранное расположение по умолчанию.

    Вы также можете изменить расположение по умолчанию, выполнив следующие действия.

    1. Нажмите кнопку Обзор.

      Снимок экрана: выбор параметра просмотра расположения.

    2. Выберите расположение для рабочей области проекта.

    3. Выберите папку "Выбор".

      Снимок экрана: папка для выбора.

  8. Введите подходящее имя для приложения и нажмите клавишу ВВОД.

    Снимок экрана: где ввести имя приложения.

Откроется диалоговое окно, в котором вам нужно будет выбрать "да" или "нет", чтобы доверять авторам файлов в этой папке.

Снимок экрана: диалоговое окно о доверии или нет авторам файлов в этой папке.

Ваше приложение Teams с поддержкой бота создается за несколько секунд.

Снимок экрана: создано приложение.

После создания приложения Agents Toolkit отображает следующее сообщение:

Снимок экрана: сообщение о том, что функция успешно создана.

Выберите "Локальная отладка" для предварительного просмотра проекта.

Краткий обзор создания приложения Teams. Просмотрите этот краткий обзор создания приложения Teams.

Создание приложения Teams

Ознакомление с исходным кодом приложения бота

После создания шаблонов просмотрите каталоги и файлы проекта в обозревателе в Visual Studio Code.

Снимок экрана: структура папок.

Папка или файл Содержание
m365agents.yml Основной файл проекта
m365agents.local.yml Это переопределяет m365agents.yml действия, которые включают локальное выполнение и отладку.
.vscode/ Файлы VSCode для локальной отладки.
appPackage/ Шаблоны манифеста приложения Teams.
adaptiveCards/ Адаптивные карточки, отправленные обратно ботом.
infra/ Шаблоны для подготовки ресурсов Azure.
index.js Точка входа и express обработчик приложения.
teamsBot.js Обработчик действий Teams.

Совет

Ознакомьтесь с ботами за пределами Teams, прежде чем интегрировать свой первый бот в Teams.

Создание и запуск первого приложения-бота

После настройки рабочей области проекта с помощью набора средств агентов создайте проект бота. Необходимо войти в свою учетную запись Microsoft 365.

Войдите в свою учетную запись Microsoft 365

Используйте эту учетную запись для входа в Teams. Если вы используете клиент программы для разработчиков Microsoft 365, учетная запись администратора, которую вы настраиваете при регистрации, — это учетная запись Microsoft 365.

  1. Откройте Visual Studio Code.

  2. На боковой панели выберите значок набора средств для агентов Microsoft 365.

  3. Выберите "Войти в M365, используя свои учетные данные".

    Откроется веб-браузер по умолчанию, чтобы вы могли войти в учетную запись.

  4. При появлении соответствующего запроса закройте браузер и вернитесь в Visual Studio Code.

  5. Вернуться к набору средств агентов в Visual Studio Code.

    Используйте эту учетную запись для входа в Teams. Если вы используете клиент программы для разработчиков Microsoft 365, учетная запись администратора, которую вы настраиваете при регистрации, — это учетная запись Microsoft 365.

    Снимок экрана: где войти в Microsoft 365 и Azure.

Теперь вы готовы создать приложение и запустить его локально!

Локальное создание и запуск первого приложения бота

Чтобы создать и запустить приложение в локальной среде:

  1. Нажмите клавишу F5 в Visual Studio Code, чтобы запустить приложение в режиме отладки.

    Примечание

    Если Agents Toolkit не удается выполнить проверку определенного предварительного условия, ему будет предложено выполнить проверку.

    Узнайте, что происходит при локальном запуске приложения в отладчике.

    Если вам интересно, при нажатии клавиши F5 набор средств агентов:

    1. Проверяет все следующие предварительные требования:
    • Вы вошли в систему с учетной записью Microsoft 365.
    • Для вашей учетной записи Microsoft 365 включена настраиваемая отправка приложений.
    • Поддерживаемая версия Node.js установлена.
    • Порт, необходимый приложению бота, доступен.
    1. Установите пакеты npm.
    2. Запускает Dev Tunnel, чтобы создать туннель HTTP.
    3. Регистрирует приложение в Microsoft Entra ID и настраивает приложение.
    4. Регистрирует приложение-бот в Bot Framework и настраивает приложение-бот.
    5. Регистрация приложения на портале разработчика Teams и его настройка.
    6. Запускает приложение бота.
    7. Запускает Teams в веб-браузере и загружает пользовательское приложение бота.

    Снимок экрана, на котором показано, когда для отладки нажата клавиша F5.

    Примечание

    При первом запуске приложения скачиваются все зависимости, и приложение строится. После завершения сборки автоматически откроется окно браузера. Этот процесс может занять от трех до пяти минут.

    Teams запускает приложение в веб-браузере.

  2. Войдите с помощью учетной записи Microsoft 365, если появится соответствующий запрос.

  3. Выберите "Добавить ", чтобы отправить приложение настраиваемого бота в Teams.

    Снимок экрана: диалоговое окно сведений о приложении для добавления приложения-бота в Teams.

  4. Нажмите "Открыть", чтобы открыть приложение в личной области.

    Вы также можете найти и выбрать нужную область или выбрать канал, чат или собрание из списка и переместиться в диалоговом окне, чтобы нажать кнопку "Перейти".

    Снимок экрана: диалоговое окно выбора областей со списком общих областей.

    Теперь бот успешно работает в Teams! После загрузки приложения открывается сеанс чата с ботом.

    Снимок экрана показывает, что бот запущен в клиенте Teams.

    Можно ввести welcome текст, чтобы отобразить вводную карту, и ввести текстlearn, чтобы перейти к документации по адаптивной карточке и командам бота.

    Снимок экрана: карта

    Вы можете выполнять обычные операции по отладке, такие как установка точек останова, как и с любым другим веб-приложением. bot/teamsBot.js Откройте файл и найдите onMessage() метод. Установите точку останова для любого дела. Затем введите текст.

    Узнайте, как устранить неполадки, если приложение не запускается локально.

    Чтобы успешно запустить приложение в Teams, включите отправку настраиваемых приложений в учетной записи Teams. Дополнительные сведения о пользовательской загрузке приложения см. в разделе "Предварительные требования".

    Важно

    Настраиваемая отправка приложения доступна в облаке сообщества для государственных организаций (GCC) и не поддерживается в GCC High, DoD и Teams, управляемых 21Vianet.

    Совет

    Перед отправкой пользовательского приложения проверьте наличие проблем с помощью средства проверки приложения. Это средство входит в набор средств. Исправьте ошибки, чтобы отправить приложение.

Развертывание первого приложения Teams

Вы узнали, как создавать, строить и запускать приложение Teams с возможностями бота. Заключительным этапом является развертывание приложения в Azure.

Давайте развернем первое приложение с возможностями ботов в Azure с помощью набора средств агентов.

Войдите в свою учетную запись Azure

Используйте эту учетную запись для доступа к порталу Azure Microsoft и подготовки новых облачных ресурсов для поддержки вашего приложения.

  1. Откройте Visual Studio Code.

  2. Откройте папку проекта, в которой создано приложение бота.

  3. На боковой панели выберите значок набора средств для агентов Microsoft 365.

  4. Выберите "Войти в Azure, используя свои учетные данные".

    Совет

    Если у вас установлено расширение для УЧЕТНОЙ записи AZURE и вы используете эту же учетную запись, этот шаг можно пропустить. Используйте ту же учетную запись, что и в других расширениях.

    Откроется веб-браузер по умолчанию, чтобы вы могли войти в учетную запись.

  5. При появлении соответствующего запроса закройте браузер и вернитесь в Visual Studio Code.

    В разделе "Учетные записи " боковой панели эти две учетные записи показаны отдельно. Здесь также указано количество доступных вам доступных подписок на Azure. Убедитесь, что у вас есть хотя бы одна действительная подписка Azure. Если нет, выйдите и используйте другую учетную запись.

Поздравляем! Вы создали приложение Teams! Теперь давайте продолжим и посмотрим, как развернуть одно из приложений в Azure с помощью набора средств агентов.

Подготовка и развертывание приложения в Azure

Развертывание состоит из двух этапов. Во-первых, Azure создает необходимые облачные ресурсы (другое название — provisioning). Затем Azure копирует код приложения в созданные облачные ресурсы. В этом руководстве вы развернете приложение-бот.

В чем разница между Provisioned и Deploy?
На этапе подготовки создаются ресурсы в Azure и Microsoft 365 для приложения, но в ресурсы не копируется код (HTML, CSS или JavaScript). На шаге развертывания выполняется копирование кода приложения в ресурсы, созданные на этапе подготовки. Как правило, развертывание выполняется несколько раз без подготовки новых ресурсов. Так как этап подготовки может занять некоторое время, он отделен от этапа развертывания.

Выберите значок набора средств для агентов Microsoft 365 на боковой панели Visual Studio Code.

  1. Выберите "Подготовка".

    Снимок экрана: выбор подготовки в облаке в наборе средств агентов.

  2. Выберите подписку для использования ресурсов Azure.

    На снимке экрана показана подписка для использования ресурсов Azure.

    Ваше приложение размещено с помощью ресурсов Azure.

    Диалоговое окно предупреждает о возможных затратах при работе с ресурсами в Azure.

  3. Выберите "Подготовка".

    На снимке экрана показано диалоговое окно о возможных затратах при работе с ресурсами в Azure.

    Процесс подготовки создает ресурсы в облаке Azure. Это может занять некоторое время. Вы можете следить за ходом выполнения, просматривая диалоговые окна в правом нижнем углу. Через несколько минут появится следующее уведомление:

    Снимок экрана: уведомление, в котором показано, что служба hellomsg успешно подготовлена в облаке.

    При желании можно просмотреть подготовленные ресурсы. В этом руководстве вам не нужно просматривать ресурсы.

    Подготовленный ресурс появится в разделе СРЕДА .

    Снимок экрана: подготавливаемый ресурс в разделе

  4. Выберите "Развернуть" на панели "ЖИЗНЕННЫЙ цикл" после завершения подготовки.

    Снимок экрана: развертывание в облаке, выделенное красным.

    Как и в случае с подготовкой, развертывание занимает некоторое время. Вы можете следить за процессом, наблюдая за диалоговыми окнами в правом нижнем углу. Через несколько минут появится уведомление о завершении работы.

Теперь вы можете использовать тот же процесс для развертывания ботов и приложений расширения для обмена сообщениями в Azure.

Запуск развернутого приложения

После завершения этапов подготовки и развертывания:

  1. Откройте панель отладки (Ctrl+Shift+D / ⌘⇧-D или View > Run) из Visual Studio Code.

  2. В раскрывающемся списке конфигурации запуска выберите "Удаленный запуск (пограничный) ".

  3. Нажмите кнопку "Запустить отладку" (F5). Вам будет предложено отправить пользовательское приложение бота в Teams.

    На снимке экрана показаны отладка и удаленный запуск приложения.

  4. Нажмите кнопку Добавить.

    Снимок экрана: диалоговое окно сведений о приложении для добавления приложения в Teams.

  5. Нажмите "Открыть", чтобы открыть приложение в личной области.

    Вы также можете найти и выбрать нужную область или выбрать канал, чат или собрание из списка и переместиться в диалоговом окне, чтобы нажать кнопку "Перейти".

    Снимок экрана: диалоговое окно выбора областей со списком общих областей.

    Вы успешно добавили приложение-бот в клиент Teams.

    Снимок экрана: карта

Узнайте, что происходит при развертывании приложения в Azure

До развертывания приложение было запущено локально:

  • Серверная часть выполняется с помощью основных средств Функции Azure.
  • Конечная точка HTTP приложения, где Microsoft Teams загружает приложение, выполняется локально.

Развертывание выполняется в два этапа. Вы подготавливаете ресурсы в активной подписке Azure, а затем развертываете или отправляете серверный и интерфейсный код для приложения в Azure.

  • Серверная часть, если она настроена, использует различные службы Azure, включая Служба приложений Azure и служба хранилища Azure.
  • Интерфейсное приложение развертывается в учетной записи хранения Azure, настроенной для статического веб-хостинга.

Поздравляем!

Вы сделали это!

Вы создали приложение-бот.

Теперь, когда вы научились создавать простое приложение, вы можете перейти к созданию более сложных приложений. Вы завершили руководство по созданию бота на JavaScript.

Учебники

Отладка чат-бота ИИ с помощью игровой площадки для агентов Microsoft 365

Начните разработку приложений Microsoft Teams с помощью приложения чат-бота искусственного интеллекта Teams и выполняйте отладку с помощью песочницы для агентов Microsoft 365 (ранее известной как средство тестирования приложений для Teams). Agents Playground упрощает отладку приложений на основе ботов. Для использования Agents Playground вам не нужна учетная запись разработчика Microsoft 365, туннелирование, регистрация приложения Teams и бота.


Руководство: отладка чат-бота ИИ

Необходимые условия

Вы можете общаться со своим ботом и просматривать сообщения и адаптивные карточки в том виде, в котором они отображаются в Teams. Вы также можете имитировать действие в Instructor Playground, используя триггеры активности.

Примечание

  • Платформа "Игровые площадки агентов" доступна только в версии 5.4.0 набора средств агентов Microsoft 365 (ранее известного как "Набор средств Teams").
  • Приложение "Игровые площадки для агентов" поддерживается только для классических и веб-клиентов.

Это пошаговое руководство поможет вам создать чат-бота с ИИ с помощью набора средств Agents и выполнить отладку с помощью средства тестирования. После завершения этого руководства вы увидите следующие выходные данные, где пользователь может получить доступ к чат-боту ИИ и использовать его:

На снимке экрана показан бот, открытый в средстве тестирования.

Установка Для использования...
Visual Studio Code или Visual Studio Среды сборки JavaScript, TypeScript или C#. Используйте последнюю версию.
Набор средств для агентов Microsoft 365 Расширение Microsoft Visual Studio Code, создающее шаблоны проекта для вашего приложения. Использование набора средств агентов версии 5.4.0 Дополнительные сведения см. в статье по установке набора средств агентов.
Node.js Внутренняя среда выполнения JavaScript. Дополнительные сведения см. Node.js таблице совместимости версий для типа проекта.
OpenAI или Azure OpenAI Сначала создайте ключ API OpenAI, чтобы использовать GPT OpenAI. Если вы хотите разместить приложение или получить доступ к ресурсам в Azure, необходимо создать службу OpenAI Azure.
Microsoft Edge (рекомендуется) или Google Chrome Браузер со средствами разработчика.

Создайте рабочую область Project для приложения чат-бота ИИ

Функция бота приложения Teams создает чат-бота или бота для бесед. Он взаимодействует с веб-службой, облегчая использование ее служб. Бот может выполнять простые автоматизированные задачи, такие как обслуживание клиентов. Вы можете получить прогноз погоды, забронировать столик или любую другую услугу, предложенную с помощью разговорного бота.

На снимке экрана показано приложение с тремя функциями. Бот выделен.

Поскольку вы уже подготовились к созданию этих приложений, вы можете настроить новый проект Teams для создания приложения чат-бота ИИ.

Создайте рабочую область проекта бота

Если все необходимые условия соблюдены, давайте начнем!

  1. Откройте Visual Studio Code.

  2. Выберите значок набора средств для агентов Microsoft 365 на панели действий Visual Studio Code.

  3. Выберите "Создать агент или приложение".

    На снимке экрана показано расположение ссылки

  4. Выбор агентов для TeamsAzure>OpenAI> Введите входные данные в поле Введите ключ службы API Azure сейчас

    Снимок экрана: шаблоны приложений Agents Toolkit.

  5. Выберите основных агентов для Teams. Если вам нужен другой функционал для бота, выберите нужный вариант.

    Снимок экрана: компонент приложения для добавления в новое приложение.

  6. Выберите язык программирования JavaScript.

    Снимок экрана показывает возможность выбора языка программирования.

  7. Выберите папку по умолчанию.

    Снимок экрана показывает выбор расположения по умолчанию.

    Чтобы изменить расположение по умолчанию, выполните следующие действия.

    1. Нажмите кнопку Обзор.

      Снимок экрана: выбор параметра просмотра расположения.

    2. Выберите расположение рабочей области проекта.

    3. Выберите "Выбрать папку".

      Снимок экрана: папка для выбора.

  8. Введите подходящее имя для приложения и нажмите клавишу ВВОД .

    Снимок экрана: где ввести имя приложения.

    Появится диалоговое окно, где нужно выбрать "да" или "нет", чтобы доверять авторам файлов в этой папке.

    Снимок экрана: диалоговое окно о доверии или нет авторам файлов в этой папке.

Теперь вы успешно создали рабочую область проекта чат-бота с ИИ.

Ознакомление с исходным кодом приложения бота

Завершив формирование шаблонов, изучите каталоги и файлы проекта в разделе EXPLORER Visual Studio Code.

Снимок экрана: структура папки бота для набора средств Teams.

Имя папки или файла Содержание
env/.env.playground Файл конфигурации с переменными среды, которые могут быть зафиксированы в Git.
env/.env.playground.user Файл конфигурации с переменными среды, включая учетные данные, которые не фиксируются в Git по умолчанию.
appPackage Файлы шаблонов манифестов приложений и значки приложений (color.png и outline.png).
appPackage/manifest.json Манифест приложения для запуска приложения в локальной и удаленной среде.
src/app.js Обрабатывает бизнес-логику для чат-бота ИИ.
m365agents.yml Это основной файл проекта Agents Toolkit. Файл проекта определяет две основные вещи: свойства, конфигурацию и определения стадий.
m365agents.local.yml Это переопределяет m365agents.yml действия, которые включают локальное выполнение и отладку.
m365agents.playground.yml Это переопределяет m365agents.yml действия, которые включают локальное выполнение и отладку в средстве тестирования.

Создание и запуск приложения чат-бота ИИ

Создайте ключ OpenAI и конечную точку для чат-бота ИИ

  1. Перейдите на портал Azure.

  2. Выберите Создать ресурс и найдите Azure OpenAI.

  3. Выберите Azure OpenAI и нажмите кнопку "Создать".

    Снимок экрана: Azure OpenAI на портале Azure.

  4. Заполните необходимые сведения и нажмите кнопку "Далее".

    Снимок экрана: подписка на Azure OpenAI и группа ресурсов.

  5. Выберите Все сети, включая Интернет, которые могут получить доступ к этому ресурсу, а затем нажмите кнопку Далее.

    Снимок экрана: сведения о сети OpenAI Azure.

  6. Заполните необходимые сведения и нажмите кнопку "Далее".

    Снимок экрана: сведения о тегах OpenAI Azure.

  7. Нажмите кнопку Создать.

    Снимок экрана показывает предварительный просмотр и создание Azure OpenAI.

Вы успешно создали ключ и конечную точку для чат-бота ИИ.

Снимок экрана показывает развертывание Azure OpenAI.

Примечание

Вы также можете получить ключ API OpenAI для отладки чат-бота ИИ.

Получение ключей и конечной точки Azure OpenAI

  1. Выберите "Перейти к ресурсам".

    Снимок экрана показывает развертывание Azure OpenAI.

  2. Выберите "Ключи и конечная точка" на панели слева и скопируйте KEY и конечную точку. Можно скопировать клавишу 1 или 2.

    Снимок экрана: ключи и конечные точки.

    Сохраните KEY и конечную точку для дальнейшего использования.

  3. Выберите "Развертывания моделей " на панели слева и выберите "Управление развертываниями".

    Снимок экрана: развертывание модели для Azure OpenAI.

    Откроется окно Azure OpenAI Studio.

  4. Выберите "Развертывания" на панели слева и нажмите "+Создать новое развертывание".

    Снимок экрана: развертывание модели для Azure OpenAI.

  5. Выберите следующие сведения:

    1. Выберите GPT-35-Turbo в раскрывающемся списке "Выберите модель ".

      Примечание

      Для ИИ-чат-бота поддерживается только модель gpt-35-turbo .

    2. Выберите 0301 (по умолчанию) в раскрывающемся списке Версия модели .

    3. Введите имя развертывания и нажмите кнопку "Создать".

      Снимок экрана: модель и версия для развертывания Azure OpenAI.

    4. Скопируйте и сохраните имя развертывания для дальнейшего использования.

      Снимок экрана: имя развертывания Azure OpenAI.

Обновление ключа и конечных точек OpenAI в Azure

  1. Откройте проект в Visual Studio Code.

  2. В разделе "Проводник" перейдите к файлу env.env.playground.user>.

  3. Введите SECRET_AZURE_OPENAI_API_KEY и SECRET_AZURE_OPENAI_ENDPOINT.

    ...
SECRET_AZURE_OPENAI_API_KEY=<azure-openai-api-key>
SECRET_AZURE_OPENAI_ENDPOINT=<azure-openai-endpoint>

  4. Перейдите к файлу src>app.js .

  5. Прокомментируйте OpenAI код и раскомментируйте Azure OpenAI его.

  6. Введите имя развертывания Azure OpenAI в .azureDefaultDeployment

    
// Use OpenAI
// apiKey: config.openAIKey,
// defaultModel: "gpt-3.5-turbo",

azureApiKey: config.azureOpenAIKey,
azureDefaultDeployment: "gpt-35-turbo",
azureEndpoint: config.azureOpenAIEndpoint,

Отладка и запуск приложения чат-бота ИИ

  1. На панели слева выберите RUN and DEBUG (CTRL+SHIFT+D), а затем выберите Debug in Agents Playground из раскрывающегося списка.

    Снимок экрана: параметр для выбора отладки в песочнице агентов.

  2. Agents Playground откроет ИИ-чат-бота на веб-странице.

    На снимке экрана показан бот, открытый в средстве тестирования.

Триггеры активности

Существует два типа триггеров активности:

Предопределенные триггеры действий

Agents Playground предоставляет предопределенные триггеры активности для тестирования функциональности бота.

Категория Действия Обработчик
Запуск действия обновления установки Установка бота


Удаление бота		 onInstallationUpdate
onInstallationUpdateAdded

onInstallationUpdate
onInstallationUpdateRemove
Запуск действия по обновлению беседы Добавление пользователя


Добавление бота


Добавление канала		 onMembersAdded
onTeamsMembersAddedEvent

onMembersAdded
onTeamsMembersAddedEvent

onTeamsChannelCreatedEvent
Удаление пользователя


Удаление бота


Удалить канал

Удалить команду		 onMembersRemoved
onTeamsMembersRemovedEvent

onMembersRemoved
onTeamsMembersRemovedEvent

onTeamsChannelDeletedEvent

onTeamsTeamDeletedEvent
Переименование канала

Переименование команды		 onTeamsChannelRenamedEvent

onTeamsTeamRenamedEvent

Примечание

Все виды действий доступны не во всех областях. Например, вы не можете добавить или удалить канал в личном или групповом чате.

Предопределенные триггеры активности доступны в меню Макет действия в Instructor Playground.

Чтобы создать имитацию действия пользователя "Добавить ", выполните следующие действия.

  1. В песочнице для агентов перейдите в макет действия"Добавить> пользователя".

    Снимок экрана: параметр

    Появится диалоговое окно для предварительного просмотра обработчика действия.

  2. Выберите Отправить действие.

    Снимок экрана: параметр отправки действия для предопределенного фиктивного действия

    Бот отправляет следующий ответ:

    Снимок экрана: ответ предопределенного имитационного действия

Триггеры настраиваемых действий

Настраиваемые действия можно использовать, чтобы настроить триггеры активности, например reactionsAdded в соответствии с требованиями приложения бота. Agents Playground автоматически заполняет обязательные свойства действия. Вы также можете изменить тип действия и добавить дополнительные свойства.

  1. Выберите Имитация действия>Пользовательское действие.

    Снимок экрана: список параметров в разделе имитации действия.

  2. Добавьте messageReaction , чтобы настроить действие в свойстве type :

    {
    "type": "messageReaction",
    "reactionsAdded": [
    {
        "type": "like"
    }
    ],
    "replyToId": "d60fd1cb-3e8f-44ef-849c-404806ba1b47"
}

  3. Выберите Отправить действие.

    Снимок экрана показывает параметр отправки действия после настройки в фиктивном действии.

    В ответ бот отправляет onReactionsAdded обработчик.

    Снимок экрана: ответ настраиваемого фиктивного действия.

Пройти испытание

Вы придумали такой вывод?

На снимке экрана показан бот, открытый в средстве тестирования.

Поздравляем! Вы успешно создали приложение чат-бота на основе ИИ. Теперь вы научились отлаживать приложение чат-бота ИИ в Agents Playground.

Игровая площадка для агентов Microsoft 365

В начало

Отправка упреждающих сообщений

Упреждающее сообщение — это сообщение, отправляемое ботом в ответ на простые команды, отправленные в чате пользователем.


Руководство: отправка упреждающих сообщений

Ответ на сообщение может быть в одном из следующих форматов:

  • Приветственные сообщения
  • Запланированные сообщения
  • Уведомления

Эти пошаговые инструкции помогут вам отправить упреждающее сообщение от бота. Вы увидите следующие выходные данные:

Снимок экрана: упреждающее сообщение приветствия в чате Teams.

Необходимые условия

Убедитесь, что вы установили следующие инструменты для создания и развертывания приложений.

  Установка Для использования
  Microsoft Visual Studio Code JavaScript или TypeScript, среды сборки. Используйте последнюю версию.
  Набор средств для агентов Microsoft 365 (ранее известный как Teams Toolkit) Расширение Visual Studio Code, создающее шаблоны проекта для вашего приложения. Используйте последнюю версию.
  Node.js Внутренняя среда выполнения JavaScript. Дополнительные сведения см. Node.js таблице совместимости версий для типа проекта.
  Microsoft Teams Teams для совместной работы со всеми, с кем вы работаете, с помощью приложений для чата, собраний, звонков и все это в одном месте.
  Microsoft Edge (рекомендуется) или Google Chrome Браузер со средствами разработчика.
  Учетная запись разработчика Microsoft 365 Доступ к учетной записи Teams с соответствующими разрешениями на установку приложения.

Подготовка среды разработки

После установки необходимых средств настройте среду разработки.

Установка набора средств агентов Microsoft 365

Набор средств для агентов Microsoft 365 (ранее известный как Teams Toolkit) помогает упростить процесс разработки с помощью инструментов подготовки и развертывания облачных ресурсов для приложения и публикации в магазине Teams.

Вы можете использовать Agents Toolkit с Visual Studio Code или интерфейсом командной строки под названием Microsoft 365 Agents Toolkit CLI (ранее известный как TeamsFx CLI).

  1. Откройте Visual Studio Code и выберите расширения (CTRL+SHIFT+X или просмотр>расширений).

  2. В поле поиска введите Microsoft 365 Agents Toolkit.

  3. Выберите Установить.

    Снимок экрана: установка расширения набора средств для агентов.

    Значок набора средств агентов Microsoft 365 появится на панели действий Visual Studio Code.

Вы также можете установить набор средств агентов из магазина Visual Studio Code Marketplace.

Настройка клиента разработки для Teams

Клиент — это пространство или контейнер для вашей организации в Teams, где вы общаетесь, обмениваетесь файлами и проводите собрания. В этом же пространстве можно отправить и протестировать свое приложение. Давайте проверим, готовы ли вы разрабатывать вместе с клиентом.

Проверка параметра "Загрузить приложение"

После создания пользовательского приложения необходимо отправить его в Teams с помощью параметра Загрузить пользовательское приложение . Войдите в свою учетную запись Microsoft 365, чтобы выполнить проверку, включен ли этот параметр.

Следующие шаги помогут вам проверить, можете ли вы отправлять приложения в Teams:

  1. В клиенте Teams выберите значок "Приложения ".

  2. Выберите "Управление приложениями".

  3. Выберите "Отправить приложение".

  4. Найдите параметр для отправки пользовательского приложения. Если параметр отображается, вы можете отправить пользовательские приложения.

    Снимок экрана показывает параметр для отправки пользовательского приложения в Teams.

    Примечание

    Если вы не находите возможности отправить пользовательское приложение, обратитесь к администратору Teams.

Создание бесплатного клиента для разработчиков Teams (необязательно)

Если у вас нет учетной записи разработчика Teams, присоединяйтесь к программе разработчиков Microsoft 365.

  1. Перейдите в программу для разработчиков Microsoft 365.

  2. Выберите "Присоединиться сейчас" и следуйте инструкциям на экране.

  3. На экране приветствия выберите "Настроить подписку E5".

  4. Настройте учетную запись администратора. После завершения появится следующий экран:

    На этом снимке экрана показана программа для разработчиков Microsoft 365.

  5. Войдите в Teams с помощью только что настроенной учетной записи администратора. Убедитесь, что в Teams есть параметр "Отправить пользовательское приложение ".

Создание бота упреждающего обмена сообщениями

Чтобы создать упреждающего бота сообщений с помощью Visual Studio Code, выполните следующие действия.

  1. Откройте Visual Studio Code.

  2. Выберите значок набора средств для агентов Microsoft 365 на панели действий Visual Studio Code.

  3. На левой панели выберите Просмотреть примеры.

    Снимок экрана: параметр

  4. В списке образцов выберите "Упреждающий обмен сообщениями". Открывается готовый образец, готовый к отладке.

    Снимок экрана показывает пример предварительно созданного бота упреждающего обмена сообщениями в списке примеров.

  5. Нажмите кнопку Создать.

    Снимок экрана: параметр

  6. Выберите папку по умолчанию для сохранения корневой папки проекта в расположении по умолчанию.

    Снимок экрана: возможность выбора расположения по умолчанию.

    Если вы хотите изменить расположение по умолчанию, выполните следующие действия:

    1. Нажмите кнопку Обзор.

      Снимок экрана показывает параметр для просмотра расположения.

    2. Выберите расположение для рабочей области проекта.

    3. Выберите "Выбрать папку".

      На снимке экрана показан вариант выбора папки.

    Проактивный бот сообщений создается за несколько секунд и отображает диалоговое окно успешного выполнения упреждающего сообщения бота в правом нижнем углу с возможностью отладки:

    На снимке экрана показан созданный проактивный бот сообщений. :::

  7. Выберите значок "Запустить и отладить" в левом верхнем углу.

  8. В раскрывающемся списке выберите "Отладка" (Microsoft Edge) или "Отладка" (Chrome).

    Снимок экрана: параметры отладки, доступные для выбора.

    При успешной отладке вам будет предложено отправить бота упреждающих сообщений в Teams на локальном компьютере.

  9. Нажмите кнопку Добавить.

    Снимок экрана: диалоговое окно со сведениями о расширении сообщения с выделенной кнопкой

  10. Выполните поиск и выберите нужную область или выберите канал, чат или собрание из списка и переместитесь в диалоговом окне, чтобы нажать кнопку "Перейти".

    Снимок экрана: диалоговое окно выбора областей со списком общих областей.

    Приложение проактивного бота обмена сообщениями загружается в клиент Teams, и в ответ на отправленное сообщение появляется следующее сообщение.

    Снимок экрана: упреждающий ответ бота сообщений в чате.

  11. Скопируйте и вставьте URL-адрес или перейдите по URL-адресу в браузере. Активируется упреждающее сообщение приветствия, которое публикуется в чате.

    Снимок экрана: браузер, который запускает бота для ответа упреждающим сообщением в Teams.

  12. Перейдите в Teams. Вы получите упреждающее сообщение приветствия от бота.

    Снимок экрана: ответ бота в чате.

Знакомство с исходным кодом

Набор средств агентов содержит компоненты для создания приложения. После создания проекта вы можете просмотреть папки и файлы проекта в области EXPLORER Visual Studio Code.

Снимок экрана: вкладка

Новая папка проекта содержит следующее содержимое:

Папка или файл Содержание
.vscode/ Файлы Visual Studio Code для отладки.
appManifest/ Шаблоны манифеста приложения (прежнее название — манифест приложения Teams).
env/ Пары "имя/значение" хранятся в файлах среды и используются для m365agents.yml настройки правил подготовки и развертывания.
manifest.json Манифест приложения для публикации через портал разработчика для Teams хранится в Properties/manifest.json.
m365agents.yml Основной файл проекта описывает конфигурацию приложения и определяет набор действий для выполнения на каждом этапе жизненного цикла.
m365agents.local.yml Это переопределяет m365agents.yml действия, которые включают локальное выполнение и отладку.

Развертывание бота упреждающего обмена сообщениями

Вы узнали, как создавать и запускать приложение Teams с поддержкой упреждающего бота сообщений. Давайте развернем первое приложение с функцией упреждающего бота обмена сообщениями в Azure с помощью набора средств агентов.

Войдите в свою учетную запись Azure

Используйте свою учетную запись для доступа к порталу Azure Microsoft и подготовки новых облачных ресурсов для поддержки вашего приложения.

  1. Откройте Visual Studio Code.

  2. Откройте папку проекта, в которой вы создали приложение "Упреждающее сообщение".

  3. Выберите значок набора средств для агентов Microsoft 365 на панели действий Visual Studio Code.

  4. Выберите "Войти в Azure, используя свои учетные данные".

    Совет

    Если у вас установлено расширение для УЧЕТНОЙ записи AZURE и вы используете эту же учетную запись, этот шаг можно пропустить.

    Откроется веб-браузер по умолчанию, чтобы вы могли войти в учетную запись.

  5. При появлении соответствующего запроса закройте браузер и вернитесь в Visual Studio Code.

В разделе "Учетные записи " боковой панели эти две учетные записи показаны отдельно. Здесь также указано количество доступных вам доступных подписок на Azure. Убедитесь, что у вас есть хотя бы одна действительная подписка Azure. Если нет, выйдите и используйте другую учетную запись.

Развертывание приложения в Azure

Развертывание состоит из двух этапов. Сначала создаются необходимые облачные ресурсы (другое название — инициализация). Затем код вашего приложения копируется в созданные облачные ресурсы. В этом руководстве вы развернете приложение-бот.

В чем разница между Provisioned и Deploy?
Подготовка создает ресурсы в Azure и Microsoft 365 для вашего приложения, но код (HTML, CSS и JavaScript) не копируется в ресурсы.
Развертывание копий кода для приложения в ресурсах, созданных во время подготовки. Как правило, развертывание выполняется несколько раз без подготовки новых ресурсов. Так как подготовка может занять некоторое время, она выполняется отдельно от развертывания.

  1. Выберите значок набора средств для агентов Microsoft 365 на панели действий Visual Studio Code.

  2. Выберите "Подготовка" в разделе "ЖИЗНЕННЫЙ ЦИКЛ".

    На снимке экрана показаны команды подготовки.

  3. Выберите одну из существующих подписок.

    Снимок экрана: вариант подписки для подготовки.

  4. Выберите существующую группу ресурсов или создайте новую. Дополнительные сведения см. в статье Создание группы ресурсов.

    Снимок экрана: параметр группы ресурсов для подготовки.

    Примечание

    Появится диалоговое окно с упоминанием о том, что при запуске ресурсов в Azure могут возникнуть затраты.

  5. Выберите "Подготовка".

    Снимок экрана: диалоговое окно подготовки.

    Процесс подготовки создает ресурсы в облаке Azure. Вы можете отслеживать ход выполнения в диалоговых окнах, которые появляются в правом нижнем углу. Через несколько минут появится следующее диалоговое окно:

    На снимке экрана показано диалоговое окно завершения подготовки.

  6. Выберите "Развернуть" в разделе "ЖИЗНЕННЫЙ ЦИКЛ".

    Снимок экрана: параметр

  7. Выберите "Развернуть".

    Снимок экрана: диалоговое окно подтверждения развертывания.

    Развертывание занимает некоторое время. Вы можете отслеживать ход выполнения в диалоговых окнах, которые появляются в правом нижнем углу. Через несколько минут появится следующее диалоговое окно.

    На снимке экрана показано диалоговое окно подтверждения развертывания.

  8. Откройте панель отладки (Ctrl+Shift+D / ⌘⇧-D или View>Run) из Visual Studio Code.

  9. В раскрывающемся списке конфигурации запуска выберите Удаленный запуск (пограничный).

    На снимке экрана выделен параметр удаленной отладки.

    При успешной отладке вам будет предложено отправить приложение бота упреждающих сообщений в Teams.

  10. Нажмите кнопку Добавить.

    Снимок экрана: диалоговое окно приложения для расширения сообщений с выделенной кнопкой

  11. Выполните поиск и выберите нужную область или выберите канал, чат или собрание из списка и переместитесь в диалоговом окне, чтобы нажать кнопку "Перейти".

    Снимок экрана: диалоговое окно выбора областей со списком общих областей.

    Приложение проактивного бота обмена сообщениями загружается в клиент Teams, и в ответ на отправленное сообщение появляется следующее сообщение.

    Снимок экрана: упреждающий ответ бота сообщений в чате.

  12. Скопируйте и вставьте URL-адрес или перейдите по URL-адресу в браузере. Активируется упреждающее сообщение приветствия, которое публикуется в чате.

    Снимок экрана: браузер, который запускает бота для ответа упреждающим сообщением в Teams.

  13. Перейдите в Teams. Вы получите упреждающее сообщение приветствия от бота.

    Снимок экрана: ответ бота в чате.

Пройти испытание

Вы что-то подобное придумали?

Снимок экрана: упреждающее сообщение приветствия.

Сценарий завершен.

  • Вы можете отправлять уведомления ежедневно или периодически запрашивать отзывы пользователей.
  • Вы можете использовать ограничения регулирования, чтобы избежать многократных уведомлений.

Отправка упреждающих сообщений

В начало

Создание расширения для обмена сообщениями на основе API

Расширения для сообщений, созданные с помощью API (на основе API), значительно расширяют функциональные возможности ваших приложений Teams, позволяя им взаимодействовать с внешними службами. Расширения для обмена сообщениями на основе API могут помочь оптимизировать рабочие процессы, уменьшая необходимость переключения между различными приложениями.


Руководство: создание расширения для обмена сообщениями на основе API

Примечание

Расширения сообщений на основе API поддерживают только поисковые команды.

Расширения для обмена сообщениями на основе API можно использовать для интеграции внешних служб, которые обычно используются в бизнес-процессах. Например, компания, которая часто использует CRM-систему для управления клиентами, может использовать расширение для сообщений для получения и отображения данных о клиентах непосредственно из Teams. Это приложение помогает сэкономить время и повысить эффективность, уменьшая необходимость переключения между различными приложениями. Эта функция поддерживается на всех платформах, где доступно приложение Teams, включая компьютеры, Интернет и мобильные устройства.

Необходимые условия для создания расширения сообщения

Ниже приведен список средств, необходимых для создания и развертывания приложений.

Установка Для использования...
Microsoft Teams Microsoft Teams для совместной работы со всеми, с кем вы работаете, с помощью приложений для чата, собраний или звонков — все в одном месте.
Microsoft Edge (рекомендуется) или Google Chrome Браузер со средствами разработчика.
Visual Studio Code Среды сборки JavaScript, TypeScript или SharePoint Framework (SPFx). Используйте версию 1.55 или более позднюю.
Учетная запись разработчика Microsoft 365 Доступ к учетной записи Teams с соответствующими разрешениями на установку приложения.
Учетная запись Azure Доступ к ресурсам Azure.
Документ с описанием OpenAPI (OAD) Документ, описывающий возможности вашего API. Дополнительные сведения см. в описании OpenAPI.

Настройка клиента разработки для Teams

Клиент — это своего рода пространство или контейнер для вашей организации в Teams, где вы общаетесь, обмениваетесь файлами и проводите собрания. В этом же пространстве можно отправить и протестировать пользовательское приложение. Давайте проверим, готовы ли вы разрабатывать вместе с клиентом.

Проверка параметра отправки пользовательского приложения

После создания приложения необходимо загрузить его в Teams, не распространяя его. Этот процесс называется пользовательской отправкой приложения. Войдите в свою учетную запись Microsoft 365, чтобы просмотреть этот вариант.

Примечание

Пользовательская отправка приложения необходима для предварительного просмотра и тестирования приложений в локальной среде Teams. Если он не включен, вы не сможете предварительно просматривать и тестировать приложение в локальной среде Teams.

У вас уже есть клиент и есть права администратора? Давайте проведем проверку, действительно ли вы это делаете!

Проверьте, можете ли вы отправить пользовательское приложение в Teams:

  1. В клиенте Teams выберите значок "Приложения ".

  2. Выберите "Управление приложениями".

  3. Выберите "Отправить приложение".

  4. Найдите параметр для отправки пользовательского приложения. Если вы видите параметр, пользовательская отправка приложений включена.

    На снимке экрана показана домашняя страница бота.

Примечание

Если вы не можете найти параметр для отправки пользовательского приложения, обратитесь к администратору Teams.

Создание бесплатного клиента для разработчиков Teams (необязательно)

Если у вас нет учетной записи разработчика Teams, вы можете получить ее бесплатно. Присоединяйтесь к программе Microsoft 365 для разработчиков!

  1. Перейдите в программу для разработчиков Microsoft 365.

  2. Выберите "Присоединиться сейчас" и следуйте инструкциям на экране.

  3. На экране приветствия выберите "Настроить подписку E5".

  4. Настройте учетную запись администратора. После завершения появится следующий экран.

    На снимке экрана показана программа для разработчиков Microsoft 365.

  5. Войдите в Teams с помощью только что настроенной учетной записи администратора. Убедитесь, что в Teams есть параметр "Отправить пользовательское приложение ".

Получите бесплатную учетную запись Azure

Если вы хотите разместить приложение или получить доступ к ресурсам в Azure, у вас должна быть подписка на Azure. Создайте бесплатную учетную запись , прежде чем начать.

У вас есть все инструменты для настройки учетной записи. Далее давайте настроим вашу среду разработки и начнем создавать! Сначала выберите приложение, которое вы хотите создать.

Создать документ с описанием OpenAPI

Описание OpenAPI (OAD) — это стандартная отраслевая спецификация, которая описывает структуру и структурирование файлов OpenAPI. Это независимый от языка и удобочитаемый формат для описания API. И людям, и машинам легко читать и писать. Схема машиночитаема и представлена в формате YAML или JSON.

Для взаимодействия с API необходим документ с описанием OpenAPI. Документ с описанием OpenAPI должен соответствовать следующим критериям:

  • Свойство auth указывать не нужно.

  • Поддерживаются форматы JSON и YAML.

  • Поддерживаются версии OpenAPI 2.0 и 3.0.x.

  • Teams не поддерживает конструкции oneOf, anyOf, allOf и not (swagger.io).

  • Создание массивов для запроса не поддерживается, однако вложенные объекты в тексте запроса JSON поддерживаются.

  • Для совместимости с широким спектром API-интерфейсов в тексте запроса, если он присутствует, должен быть application/json.

  • Определите URL-адрес сервера протокола HTTPS для servers.url свойства.

  • Поддерживается только поиск по одному параметру.

  • Допускается только один обязательный параметр без значения по умолчанию.

  • Поддерживаются только методы POST и GET HTTP.

  • Документ с описанием OpenAPI должен содержать файл operationId.

  • Операция не должна требовать параметры Header или Cookie без значений по умолчанию.

  • Команда должна иметь только один параметр.

  • Убедитесь, что в документе с описанием OpenAPI нет удаленных ссылок.

  • Обязательный параметр со значением по умолчанию считается необязательным.

    В качестве примера для этого руководства мы использовали следующее описание OpenAPI:

    Описание OpenAPI 
        openapi: 3.0.1
    info:
    title: OpenTools Plugin
    description: A plugin that allows the user to find the most appropriate AI tools for their use cases, with their pricing information.
    version: 'v1'
    servers:
        - url: https://gptplugin.opentools.ai
    paths:
    /tools:
    get:
    operationId: searchTools
    summary: Search for AI Tools
        parameters:
        - in: query
          name: search
          required: true
          schema:
          type: string
          description: Used to search for AI tools by their category based on the keywords. For example, a search for "tool to create music" provides a list of tools that can create music.
        responses:
        "200":
          description: OK
          content:
          application/json:
            schema:
            $ref: '#/components/schemas/searchToolsResponse'
        "400":
          description: Search Error
          content:
          application/json:
            schema:
            ref: '#/components/schemas/searchToolsError'
        components:
        schemas:
        searchToolsResponse:
        required:
        - search
        type: object
        properties:
        tools:
        type: array
        items:
        type: object
        properties:
        name:
        type: string
        description: The name of the tool.
        opentools_url:
        type: string
        description: The URL to access the tool.
        main_summary:
        type: string
        description: A summary of what the tool is.
        pricing_summary:
        type: string
        description: A summary of the pricing of the tool.
        categories:
        type: array
        items:
        type: string
        description: The categories assigned to the tool.
        platforms:
        type: array
        items:
        type: string
        description: The platforms that this tool is available on.
        description: The list of AI tools.
        searchToolsError:
        type: object
        properties:
        message:
        type: string
        description: Message of the error.

    Примечание

    Убедитесь, что свойство required: true доступно только для одного параметра. Если существует несколько обязательных параметров, можно обновить требуемое свойство required: false для других параметров.

Вы можете проверить, является ли документ OpenAPI Description допустимым. Чтобы проверить это, выполните следующие действия:

  1. Перейдите к валидатору Swagger или OpenAPI и проверьте документ с описанием OpenAPI.

  2. Сохраните документ с описанием OpenAPI.

  3. Перейдите в редактор Swagger.

  4. В левой области вставьте описание OpenAPI в редакторе.

  5. На панели справа выберите GET.

  6. Выберите "Попробовать".

  7. Введите значения для параметра поиска"Инструмент создания музыки".

  8. Нажмите кнопку "Выполнить". Редактор Swagger отобразит ответ со списком продуктов.

    На скриншотах показаны параметры, их значения и опция **EXECUTE** в редакторе swagger.

  9. Перейдите ктексту ответасервера>.

  10. В разделе productsскопируйте первый продукт из списка и сохраните его для дальнейшего использования.

    Снимки экрана: выделенный продукт, выбранный в тексте ответа.

Создание шаблона отрисовки ответа

Для документа OpenAPI Description требуется шаблон отрисовки отклика, чтобы приложение могло отвечать на запросы GET или POST. Шаблон отрисовки ответа состоит из шаблона адаптивной карточки, шаблона предварительной карты и метаданных.

Шаблон адаптивной карточки

Чтобы создать шаблон адаптивной карточки, выполните указанные ниже действия.

  1. Перейдите в ChatGPT и задайте следующий запрос в области составления сообщения:

    
Create an Adaptive Card Template that binds to the following response:
    "categories": [
        "Music Generation",
        "AI Detection"
    ],
    "chatbot_short_url": "https://goto.opentools.ai/c/ai-music-generator",
    "main_summary": "AI Music Generator is an AI-powered music composing tool that allows users to create original and personalized music for various purposes. It can generate melodies, harmonies, and rhythms tailored to specific needs and preferences, with customization options such as genre, mood, length, and instrumentation. The tool is designed for creative individuals, from beginners to professionals, and can produce high-quality music in seconds. Every generated piece of music is royalty-free and can be used instantly, with no limitations on beat creation. With advanced AI technology, AI Music Generator makes music production accessible to everyone.",
    "name": "AI Music Generator",
    "opentools_url": "https://goto.opentools.ai/ai-music-generator",
    "platforms": [
        "Web",
        "App",
        "API"
    ]

  2. Выберите "Отправить сообщение".

  3. ChatGPT создает ответ с помощью шаблона адаптивной карточки, который привязывается к примеру данных. Сохраните шаблон адаптивной карточки для дальнейшего использования.

    Ниже приведен пример шаблона адаптивной карточки.

    Шаблон адаптивной карточки 
    
{
"$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
"type": "AdaptiveCard",
"version": "1.4",
"body": [
    {
    "type": "TextBlock",
    "text": "AI Music Generator",
    "weight": "Bolder",
    "size": "Large"
    },
    {
    "type": "TextBlock",
    "text": "Categories",
    "size": "Medium"
    },
    {
    "type": "TextBlock",
     "text": "Music Generation, AI Detection",
     "wrap": true
    },
    {
    "type": "TextBlock",
    "text": "Description",
    "size": "Medium"
    },
    {
    "type": "TextBlock",
    "text": "AI Music Generator is an AI-powered music composing tool that allows users to create original and personalized music for various purposes. It can generate melodies, harmonies, and rhythms tailored to specific needs and preferences, with customization options such as genre, mood, length, and instrumentation. The tool is designed for creative individuals, from beginners to professionals, and can produce high-quality music in seconds. Every generated piece of music is royalty-free and can be used instantly, with no limitations on beat creation. AI Music Generator is powered by advanced AI technology, and it makes music production accessible to everyone.",
    "wrap": true
    },
    {
    "type": "TextBlock",
    "text": "Platform",
    "size": "Medium"
    },
    {
    "type": "TextBlock",
    "text": "Web, App, API",
    "wrap": true
    }
],
"actions": [
    {
    "type": "Action.OpenUrl",
    "title": "Learn More",
    "url": "https://goto.opentools.ai/ai-music-generator"
    },
    {
    "type": "Action.OpenUrl",
    "title": "Try It",
    "url": "https://goto.opentools.ai/c/ai-music-generator"
    }
]
}

  4. Чтобы проверить, привязывается ли сгенерированная адаптивная карточка к образцу данных, выполните следующие действия.

    1. Перейдите в Designer адаптивных карточек.

    2. Перейдите в раздел "Выбор ведущего приложения", а затем выберите Microsoft Teams в раскрывающемся списке.

    3. Перейдите в РЕДАКТОР ПОЛЕЗНЫХ ДАННЫХ КАРТЫ и вставьте код шаблона адаптивной карты.

    4. Перейдите в SAMPLE DATA EDITOR и вставьте ответ GET API, сохраненный ранее.

      На снимках экрана показан конструктор адаптивных карточек с шаблоном адаптивной карточки и примером данных.

    5. Выберите режим предварительного просмотра. Конструктор адаптивных карточек отображает адаптивную карточку с данными, которые связывают ответ с шаблоном.

      На снимке экрана показан конструктор адаптивных карточек с шаблоном адаптивной карточки и примером данных.

Создание шаблона карт для предварительного просмотра

Шаблон карты предварительного просмотра может содержать , titlesubtitleи image свойства. Если в ответе API нет изображения, вы можете удалить свойство изображения.

Ниже приведен пример шаблона предварительной карты:

Шаблон карт для предварительного просмотра 
   "previewCardTemplate": {
        "title": "${if(name, name, 'N/A')}",
        "subtitle": "$${if(price, price, 'N/A')}"
    }

Создайте условие "если" для и titlesubtitle, где:

  • Если имя существует, бот использует его.
  • Если имени не существует, бот использует НД.

Например, "title": "Name: ${if(name, name, 'N/A')}". Сохраните шаблон предварительной карты для дальнейшего использования.

Шаблон для отрисовки ответа

Шаблон отрисовки ответа должен соответствовать схеме, размещенной в https://developer.microsoft.com/json-schemas/teams/v1.20/MicrosoftTeams.ResponseRenderingTemplate.schema.json.

Чтобы создать шаблон отрисовки ответа, выполните следующие действия.

  1. Создайте JSON-файл и добавьте в него следующий код:

    { 
  "$schema": "https://developer.microsoft.com/json-schemas/teams/v1.20/MicrosoftTeams.ResponseRenderingTemplate.schema.json", 
  "version": "1.0", 
  "jsonPath": "", 
  "responseLayout": "", 
  "responseCardTemplate": { 
 },
 "previewCardTemplate": {
     }
 }

  2. Обновите свойства в шаблоне отрисовки ответа следующим образом:

    # Имя свойства Value (Значение)
    1. "$schema" "https://developer.microsoft.com/json-schemas/teams/v1.20/MicrosoftTeams.ResponseRenderingTemplate.schema.json"
    2. "version" "1.0"
    version — это версия шаблона отрисовки, которую нужно использовать.
    3. "jsonPath" "tools"
    jsonPath — путь к одному или нескольким результатам в ответе JSON. Добавьте в jsonPath соответствующий массив данных или массив из списка продуктов в ответе API. В jsonPath данном случае это инструменты. Дополнительные сведения о том, как определить путь JSON, см. в разделе Запрос JSON с помощью пути JSON.
    4. "responseLayout" "list"
    responseLayout Определяет макет вложений. Используется для ответов типа result. Поддерживаются типы списков и сетки. Если текст ответа содержит объект с несколькими элементами, такими как текст, заголовок и изображение, то макет ответа должен быть установлен на list. Если ответ API содержит только изображения или эскизы, то макет ответа должен быть установлен на grid.
    5. "responseCardTemplate" Вставьте сохраненный ранее код шаблона адаптивной карточки.
    responseCardTemplate — это шаблон адаптивной карточки для сопоставления ответа JSON с адаптивной карточкой.
    6. "previewCardTemplate" Вставьте сохраненный ранее код шаблона карт предварительного просмотра.
    previewCardTemplateявляется шаблоном предварительной карты, который используется для предварительного просмотра результатов во всплывающем окне расширения сообщения.

  3. Сохраните шаблон отрисовки ответа в той же папке, в которой сохранен документ OpenAPI Description.

Следующий код является примером шаблона отрисовки ответа:

Шаблон для отрисовки ответа 

{
    "$schema": "https://developer.microsoft.com/json-schemas/teams/v1.20/MicrosoftTeams.ResponseRenderingTemplate.schema.json",
    "version": "1.0",
    "jsonPath": "tools",
    "responseLayout": "list",
    "responseCardTemplate": {
        "type": "AdaptiveCard",
        "version": "1.4",
        "body": [
            {
            "type": "TextBlock",
            "text": "AI Music Generator",
            "weight": "Bolder",
            "size": "Large"
            },
            {
            "type": "TextBlock",
            "text": "Categories",
            "size": "Medium"
            },
            {
            "type": "TextBlock",
            "text": "Music Generation, AI Detection",
            "wrap": true
            },
            {
            "type": "TextBlock",
            "text": "Description",
            "size": "Medium"
            },
            {
            "type": "TextBlock",
            "text": "AI Music Generator is an AI-powered music composing tool that allows users to create original and personalized music for various purposes. It can generate melodies, harmonies, and rhythms tailored to specific needs and preferences, with customization options such as genre, mood, length, and instrumentation. The tool is designed for creative individuals, from beginners to professionals, and can produce high-quality music in seconds. Every generated piece of music is royalty-free and can be used instantly, with no limitations on beat creation. With advanced AI technology, AI Music Generator makes music production accessible to everyone.",
            "wrap": true
            },
            {
            "type": "TextBlock",
            "text": "Platform",
            "size": "Medium"
            },
            {
            "type": "TextBlock",
            "text": "Web, App, API",
            "wrap": true
            }
        ],
        "actions": [
            {
            "type": "Action.OpenUrl",
            "title": "Learn More",
            "url": "https://goto.opentools.ai/ai-music-generator"
            },
            {
            "type": "Action.OpenUrl",
            "title": "Try It",
            "url": "https://goto.opentools.ai/c/ai-music-generator"
            }
        ]
    },
    "previewCardTemplate": {
        "title": "${if(name, name, 'N/A')}",
        "subtitle": "$${if(price, price, 'N/A')}"
    } 
}

Создание манифеста приложения

Теперь необходимо создать манифест приложения (прежнее название — манифест приложения Teams). Манифест приложения описывает, как приложение интегрируется в продукт Microsoft Teams.

Создание манифеста приложения Teams

Чтобы создать манифест, выполните следующие действия:

  1. Создайте новый файл JSON. Манифест приложения должен соответствовать версии 1.20 схемы, определенной в схеме манифеста приложения.

  2. Добавьте следующий код в файл JSON:

    Манифест приложения 
    {
 "$schema": "https://developer.microsoft.com/json-schemas/teams/v1.20/MicrosoftTeams.schema.json",
 "manifestVersion": "1.20",
 "version": "1.0.3",
 "id": "<<YOUR-MICROSOFT-APP-ID>>",
 "packageName": "com.microsoft.teams.extension",
 "developer": {
     "name": "Teams App, Inc.",
     "websiteUrl": "https://www.example.com",
     "privacyUrl": "https://www.example.com/termofuse",
     "termsOfUseUrl": "https://www.example.com/privacy"
 },
 "icons": {
     "color": "color.png",
     "outline": "outline.png"
 },
 "name": {
     "short": "Search ME API",
     "full": "Search ME API full"
 },
 "description": {
     "short": "product app for testing API Message Extensions",
     "full": "product app for testing API Message Extensions"
 },
 "accentColor": "#FFFFFF",
 "composeExtensions": [
     {
         "composeExtensionType": "",
         "apiSpecificationFile": "",
         "commands": [
             {
                 "context": [
                     "compose"
                 ],
                 "type": "query",
                 "title": "API for fetching Klarna.",
                 "id": "",
                 "parameters": [
                     {
                         "name": "",
                         "title": "",
                         "description": ""
                     }
                 ],
                 "description": "",
                 "apiResponseRenderingTemplateFile": ""
             }
         ]
     }
 ],
 "permissions": [
     "identity",
     "messageTeamMembers"
 ],
 "validDomains": []
}

  3. Обновите свойства манифеста приложения следующим образом:

    • Заменить <<YOUR-MICROSOFT-APP-ID>> на ИД приложения Майкрософт бота.
    • Обновите значение для composeExtensionType .apiBased
    • Обновите значение пути apiSpecificationFile к файлу описания OpenAPI.
    • Обновите значение для commands.id .searchTools
    • Обновите значение для commands.title .Search for AI Tools
    • Обновите значение для commands.description .Search for AI Tools
    • Обновите значение для parameters.name .search Если параметры отсутствуют, значения должны быть параметрами запроса или properties.name ссылаться на свойство в схеме текста запроса.
    • Обновите apiResponseRenderingTemplateFile путь к файлу шаблона отрисовки ответа.
    • Обновите значение до validDomains конечной точки, service URL определенной в файле описания OpenAPI.

  4. Сохраните манифест приложения Teams в той же папке, в которой вы сохранили документ с описанием OpenAPI и шаблон отрисовки ответа.

    • Вам понадобится цветное изображение и контурное изображение. Эти изображения должны быть включены в папку и использоваться в манифесте приложения Teams.

    • Заархивируйте содержимое папки. ZIP-файл должен включать следующие файлы:

      • Документ с описанием OpenAPI
      • Шаблон для отрисовки ответа
      • Манифест приложения
      • Значок цвета
      • Значок ''Контур''

Отправка пользовательского приложения в Teams

Войдите в тестовую среду Teams, чтобы протестировать приложение в Teams. Чтобы загрузить пользовательское приложение в Teams, выполните следующие действия.

  1. Перейдите в Microsoft Teams и выполните вход, используя учетные данные тестового клиента.

  2. Перейдите в раздел "Приложения""Управление> приложением>" "Отправить приложение".

  3. Выберите "Отправить пользовательское приложение".

  4. Выберите созданный ZIP-файл и нажмите кнопку "Открыть".

  5. Нажмите кнопку Добавить.

    Снимок экрана: приложение расширения для сообщений с выделенной кнопкой

  6. Нажмите кнопку Открыть.

    Снимок экрана: приложение расширения для сообщений с выделенной кнопкой

  7. Перейдите в чат, выберите + в области создания сообщения и найдите свое приложение.

  8. Выберите приложение и создайте поисковый запрос.

    На снимке экрана показано, что с помощью значка

  9. Приложение отвечает адаптивной картой в окне чата.

  10. Нажмите кнопку Отправить.

    Снимок экрана: адаптивная карточка с результатами поиска в сообщении чата в Teams.

Поздравляем! Получилось! Вы узнали о создании расширения для обмена сообщениями на основе API с помощью документа с описанием OpenAPI.

Создание расширения для обмена сообщениями на основе API

В начало

Создание расширения сообщений на основе действий

Расширение сообщений Teams на основе действий позволяет пользователям взаимодействовать с веб-службами в клиенте Microsoft Teams. Расширения для сообщений помогают инициировать действия во внешней системе из области создания сообщений, командного поля или непосредственно из сообщения.


Руководство: создание расширения для сообщений на основе действий

Основные функции расширения сообщений на основе действий:

  • Представляет пользователю модальное всплывающее окно для сбора или отображения информации.
  • Вызывает команды действий из области создания сообщения, командного поля или сообщения.

Это пошаговое руководство поможет вам создать расширение сообщений Teams на основе действий, чтобы инициировать действия из создания сообщения и области сообщений. К концу этого руководства вы получите следующие результаты:

Снимок экрана: выходные данные расширения сообщения после успешного прохождения пошагового руководства.

Необходимые условия

Установите следующие средства и настройте среду разработки:

  Установка Для использования...
  Microsoft Teams Microsoft Teams для совместной работы со всеми, с кем вы работаете, с помощью приложений для чата, собраний и звонков в одном месте.
  Visual Studio 2022 Вы можете установить корпоративную версию в Visual Studio 2022, а также установить рабочие нагрузки ASP.NET и веб-разработки. Используйте последнюю версию.
  Пакет SDK для .NET Core Настраиваемые привязки для локальной отладки и развертывания приложений Функции Azure. Если вы еще не установили последнюю версию, установите портативную версию.
  Туннель разработчика Для функций приложения Teams (боты для бесед, расширения сообщений и входящие веб-перехватчики) требуются входящие подключения. Туннель соединяет вашу систему разработки с Teams. Туннель разработчика — это мощный инструмент для безопасного открытия локального хоста в Интернете и управления доступом к нему. Туннель разработчика доступен в Visual Studio 2022 версии 17.7.0 или более поздних версиях.
или
Вы также можете использовать ngrok в качестве туннеля для подключения вашей системы разработки к Teams. Это не обязательно для приложений, которые включают только вкладки. Этот пакет устанавливается в каталоге проекта (с помощью npm devDependencies).

Примечание

Скачав ngrok, зарегистрируйтесь и установите authtoken.

Настройка локальной среды

  1. Откройте Microsoft-teams-Samples.

  2. Выберите код.

  3. В раскрывающемся меню выберите "Открыть с помощью GitHub Desktop".

    Снимок экрана: параметр клонирования репозитория в локальном репозитории.

  4. Выберите "Клонировать".

Регистрация приложения Microsoft Entra

Следующие шаги помогут вам создать и зарегистрировать бота на портале Azure:

  • Создайте и зарегистрируйте приложение Azure.
  • Создайте секрет клиента, чтобы включить проверку подлинности бота с помощью единого входа.
  • Добавьте канал Teams для развертывания бота.
  • Создайте туннель к конечным точкам веб-сервера с помощью туннеля разработки (рекомендуется) или ngrok.
  • Добавьте конечную точку обмена сообщениями в созданный туннель разработки.

Добавление регистрации приложения

  1. Перейдите на портал Azure.

  2. Выберите «Регистрация приложений».

    На снимке экрана показаны службы Azure для выбора Регистрация приложений.

  3. Выберите + Новая регистрация.

    Снимок экрана: страница новой регистрации в Центре администрирования Microsoft Entra.

  4. Введите имя приложения.

  5. Выберите учетные записи в любом каталоге организации (любой клиент Microsoft Entra ID — многоклиентский).

  6. Выберите Регистрация.

    На снимке экрана показан параметр регистрации бота в Центре администрирования Microsoft Entra.

    Ваше приложение зарегистрировано в Microsoft Entra ID. Откроется страница обзора приложения.

    На снимке экрана показана страница обзора регистрации приложения.

    Примечание

    Сохраните идентификатор приложения из идентификатора приложения (клиента) и идентификатора каталога (клиента) для дальнейшего использования.

Создание туннеля

Для создания туннеля используйте один из следующих двух способов.

  1. Откройте Visual Studio.

  2. Выберите "Создать проект".

    Снимок экрана: выбор для создания нового проекта.

  3. В поле поиска введите ASP.NET. В результатах поиска выберите веб-приложение ASP.NET Core.

  4. Нажмите кнопку Далее.

    Снимок экрана: поиск и выбор шаблона.

  5. Введите имя проекта и нажмите кнопку "Далее".

    Снимок экрана: имя проекта для входа.

  6. Нажмите кнопку Создать.

    Снимок экрана показывает дополнительные сведения о проекте.

    Откроется окно обзора.

    На снимке экрана показано окно обзора.

  7. В раскрывающемся списке отладки выберите Туннели разработчика (без активного туннеля)>Создать туннель....

    Снимок экрана: раскрывающийся список для выбора туннелей разработки.

    Появится всплывающее окно.

  8. Обновите следующие сведения во всплывающем окне:

    1. Учетная запись: введите учетную запись Майкрософт или GitHub.
    2. Имя: введите имя туннеля.
    3. Тип туннеля: в раскрывающемся списке выберите "Временный".
    4. Доступ: в раскрывающемся списке выберите "Общедоступный".

  9. Нажмите кнопку ОК.

    Снимок экрана: сведения о необходимости обновления для создания туннеля.

    Появится всплывающее окно, демонстрирующее успешное создание туннеля разработчика.

  10. Нажмите кнопку ОК.

    На снимке экрана показано всплывающее сообщение о создании туннеля.

    Созданный туннель можно найти в раскрывающемся списке отладки следующим образом:

    На снимке экрана показано, что туннель активен и выбран.

  11. Нажмите клавишу F5 , чтобы запустить приложение в режиме отладки.

  12. Если появится диалоговое окно "Предупреждение системы безопасности ", нажмите кнопку "Да".

    На снимке экрана показано диалоговое окно принятия предупреждения системы безопасности.

    Появится всплывающее окно.

  13. Нажмите кнопку Продолжить.

    Снимок экрана: URL-адрес туннеля.

    Домашняя страница туннеля разработки откроется в новом окне браузера, и туннель разработки станет активен.

    Снимок экрана: страница приветствия Dev Tunnel в браузере.

  14. Перейдите в Visual Studio, выберите View > Output.

  15. В раскрывающемся меню консоли вывода выберите Туннели разработки.

    В консоли вывода отображается URL-адрес туннеля разработки.

    Снимок экрана: URL-адрес в консоли вывода Visual Studio.

Добавление проверки подлинности через Интернет

  1. На панели слева в разделе "Управление" выберите "Проверка подлинности".

  2. Выберите "Добавить веб-платформу>".

    Снимок экрана: выбор проверки подлинности в Интернете.

  3. Введите URI перенаправления для приложения, добавив auth-end его к полному доменному имени. Например, https://your-devtunnel-domain/auth-end или https://your-ngrok-domain/auth-end

  4. В разделе "Неявное предоставление и гибридные потоки" установите флажки " Маркеры доступа " и "Маркеры идентификаторов ".

  5. Выберите "Настроить".

    Снимок экрана: параметр для добавления URI перенаправления и выбора неявного предоставления и гибридных потоков.

  6. В разделе "Интернет" выберите "Добавить URI".

  7. Введите https://token.botframework.com/.auth/web/redirect.

  8. Нажмите кнопку Сохранить.

    Снимок экрана: параметр для добавления URI перенаправления и выбора неявного предоставления и гибридных потоков.

Создание секрета клиента

Примечание

При возникновении ошибки секреты клиента блокируются политикой на уровне клиента. За дополнительными сведениями обратитесь к администратору клиента. Вместо этого можно создать сертификат. Пошаговые инструкции см. в разделе создания сертификата для регистрации приложения.

  1. На левой панели в разделе "Управление" выберите "Сертификаты & секреты".

  2. В разделе "Секреты клиента" выберите + Новый секрет клиента.

    Снимок экрана: выбор нового секрета клиента.

    Откроется окно добавления секрета клиента .

  3. Введите описание.

  4. Нажмите кнопку Добавить.

    Снимок экрана: параметр описания секрета клиента, который нужно добавить.

  5. В разделе "Значение" выберите "Копировать в буфер обмена ", чтобы сохранить значение секрета клиента для дальнейшего использования.

    Снимок экрана: параметр копирования значения секретного идентификатора клиента для копирования значения в буфер обмена.

Добавление разрешений API

  1. На левой панели выберите "Разрешения API".

  2. Выберите + добавьте разрешение.

    На снимке экрана показан параметр для выбора пункта

  3. Выберите Microsoft Graph.

  4. Выберите делегированные разрешения.

  5. Выберите User>User.Read.

  6. Выберите "Добавить разрешения".

    Снимок экрана показывает возможность выбора разрешений.

    Примечание

    • Если приложению не предоставлено согласие ИТ-администратора, пользователи должны предоставить согласие при первом использовании приложения.
    • Пользователи должны дать согласие на разрешения API только в том случае, если приложение Microsoft Entra зарегистрировано в другом клиенте.

Добавление URI идентификатора приложения

  1. На левой панели в разделе "Управление" выберите "Предоставление API".

  2. Рядом с URI идентификатора приложения выберите "Добавить".

    Снимок экрана показывает возможность добавления URI идентификатора приложения для приложения.

  3. Измените формат URI идентификатора приложения и api://botid-{AppID} нажмите кнопку "Сохранить".

    Снимок экрана: параметр для добавления URI идентификатора приложения и его сохранения.

Добавление области

  1. На левой панели в разделе "Управление" выберите "Предоставление API".

  2. Выберите + Добавьте область.

    Снимок экрана: выбор для добавления области.

  3. Введите access_as_user в качестве имени области.

  4. В разделе "Кто может предоставить согласие?" выберите Администраторы и пользователи.

  5. Обновите значения остальных полей следующим образом:

    • Введите Teams могут получать доступ к профилю пользователя в качестве отображаемого имени согласия администратора.

    • ВВОД Позволяет Teams вызывать веб-API приложения от имени текущего пользователя в качестве описания согласия администратора.

    • Введите Teams может получать доступ к профилю пользователя и делать запросы от имени пользователя как отображаемое имя согласия пользователя.

    • Ввод : разрешить Teams вызывать API этого приложения с теми же правами, что и пользователь, как описано в описании согласия пользователя.

  6. Убедитесь, что для состояния установлено значение "Включено".

  7. Нажмите кнопку "Добавить область".

    На следующем рисунке показаны поля и значения:

    Снимок экрана: значения, заполненные в поле для добавления области.

    Примечание

    Имя области должно совпадать с URI идентификатора приложения, после чего /access_as_user нужно добавить его.

    Снимок экрана: подробные сведения в области видимости.

Добавление клиентского приложения

  1. На левой панели в разделе "Управление" выберите "Предоставление API".

    В разделе "Авторизованные клиентские приложения" определите приложения, которые требуется авторизовать для веб-приложения вашего приложения.

  2. Выберите + добавьте клиентское приложение.

    На снимке экрана показан параметр

  3. Добавьте мобильное или классическое приложение Teams и веб-приложение Teams.

    1. Для мобильных устройств и настольных компьютеров Teams: введите идентификатор клиента в формате 1fec8e78-bce4-4aaf-ab1b-5451cc387264.

      Снимок экрана: мобильное или настольное приложение с идентификатором клиента.

    2. Для веб-версии Teams: введите идентификатор клиента в формате 5e3ce6c0-2b1f-4285-8d4b-75ee78787346.

      Снимок экрана показывает приложение с идентификатором клиента в Интернете.

  4. Установите флажок "Разрешенные области".

  5. Выберите "Добавить приложение".

    На снимке экрана показан параметр выбора разрешенных областей и добавления приложения.

    На следующем рисунке показан идентификатор клиента:

    Снимок экрана: выходные данные клиентских приложений.

Создание бота

Создание ресурса бота Azure

Примечание

Если вы уже тестируете бот в Teams, выйдите из этого приложения и Teams. Чтобы увидеть это изменение, войдите в систему еще раз.

  1. Переход на главную страницу.

  2. Выберите + Создать ресурс.

  3. В поле поиска введите Azure Bot.

  4. Нажмите клавишу ВВОД.

  5. Выберите бота Azure.

  6. Нажмите кнопку Создать.

    Снимок экрана показывает создание бота Azure.

  7. Введите имя бота в поле дескриптора бота.

  8. Выберите подписку в раскрывающемся списке.

  9. Выберите группу ресурсов в раскрывающемся списке.

    Снимок экрана: параметр группы ресурсов и подписка на портале Azure.

    Если группа ресурсов отсутствует, можно создать новую. Чтобы создать новую группу ресурсов, выполните указанные ниже действия.

    1. Выберите "Создать".
    2. Введите имя ресурса и нажмите кнопку "ОК".
    3. Выберите расположение в раскрывающемся списке "Новое расположение группы ресурсов ".

    Снимок экрана: новая команда группы ресурсов на портале Azure.

  10. В разделе "Цены" выберите "Изменить план".

    Снимок экрана показывает вариант ценообразования на портале Azure.

  11. Выберите FO Free>Select.

    На снимке экрана показан вариант выбора

  12. В разделе "Идентификатор приложения Майкрософт" выберите "Тип приложения как мультитенантный".

  13. В поле "Тип создания" выберите Использовать регистрацию существующего приложения.

  14. Введите идентификатор приложения.

    Примечание

    Вы не можете создать более одного бота с одним идентификатором приложения Майкрософт.

  15. Выберите "Рецензирование + создание".

    На снимке экрана показано создание нового бота.

  16. Когда проверка пройдена, выберите "Создать".

    Для подготовки бота требуется несколько минут.

  17. Выберите "Перейти к ресурсу".

    Снимок экрана: параметр

    Вы успешно создали бота Azure.

    Снимок экрана: выходные данные бота.

Добавление канала Teams

  1. На левой панели выберите "Каналы".

  2. В разделе "Доступные каналы" выберите Microsoft Teams.

    Снимок экрана: выбор команд в каналах.

  3. Установите флажок, чтобы принять Условия обслуживания.

  4. Выберите "Принимаю".

    Снимок экрана: принятие условий обслуживания.

  5. Нажмите Применить.

    Снимок экрана: Microsoft Teams в качестве сообщений для применения.

Добавление конечной точки обмена сообщениями

Чтобы добавить конечную точку обмена сообщениями, используйте один из следующих способов.

  1. Используйте URL-адрес туннеля разработки в консоли вывода в качестве конечной точки обмена сообщениями.

    Снимок экрана: URL-адрес в консоли вывода Visual Studio.

  2. На левой панели в разделе "Параметры" выберите "Конфигурация".

  3. Обновите конечную точку обмена сообщениями в формате https://your-devtunnel-domain/api/messages.

    На снимке экрана показан API добавления конечной точки обмена сообщениями.

  4. Нажмите Применить.

    Вы успешно настроили бота в службе ботов Azure.

    Примечание

    Если в ключе инструментирования Application Insights отображается ошибка, обновите его с помощью идентификатора приложения.

Настройка параметров приложения и файлов манифеста

  1. Перейдите к файлу appsettings.json в клонированном репозитории.

    Снимок экрана: расположение JSON-файла appsettings.

  2. Откройте файл appsettings.json и обновите следующие сведения:

    • Установите "MicrosoftAppId"идентификатор приложения Microsoft бота.
    • Установите "MicrosoftAppPassword"значение секретного идентификатора клиента вашего бота.
    • Задайте ConnectionName как имя подключения OAuth.
    • Выберите "MicrosoftAppType""Мультитенант".
    • Установите значение "Общее"MicrosoftAppTenantId"".

    Снимок экрана: элемент appsettings в формате JSON.

  3. Перейдите к файлу manifest.json в клонированном репозитории.

    Снимок экрана: выбор JSON-файла манифеста.

  4. Откройте файл manifest.json и обновите следующие изменения:

    • Замените все вхождения вашим идентификатором"{TODO: MicrosoftAppId}" приложения Майкрософт.
    • Установите "<<domain-name>>" домен ngrok или туннеля разработки.

    Снимок экрана: сведения, заполненные в файле манифеста в Visual Studio.

Сборка и запуск службы

Для сборки и запуска службы используйте Visual Studio или командную строку.

  1. Откройте Visual Studio.

  2. Перейдите в раздел File>Open>Project/Solution.....

    Снимок экрана: Visual Studio с проектом или решением, выделенным красным цветом.

  3. В папке csharp выберите файл TeamsMessagingExtensionsAction.csproj .

    Снимок экрана: клонированный репозиторий с TeamsMessagingExtensionsAction.csproj, выделенным красным цветом.

  4. Нажмите клавишу F5, чтобы запустить проект.

  5. Нажмите "Да ", если появится следующее диалоговое окно:

    Снимок экрана: предупреждение системы безопасности с параметром

    Появится веб-страница с сообщением "Ваш бот готов!".

    Снимок экрана: веб-страница с сообщением

Добавление приложения расширения сообщений о действиях в Teams

  1. В клонированном репозитории перейдите к примерам>msgext-action>csharp>TeamsAppManifest.

  2. Создайте .zip со следующими файлами, присутствующими в папке "Манифест" :

    • manifest.json
    • icon-outline.png
    • icon-color.png

    Снимок экрана: клонированный репозиторий с ZIP-файлом расширения для обмена сообщениями, выделенным красным цветом.

  3. В клиенте Teams выберите значок "Приложения ".

  4. Выберите "Управление приложениями".

  5. Выберите "Отправить приложение".

  6. Найдите параметр для отправки пользовательского приложения. Если вы видите параметр, пользовательская отправка приложений включена.

    На снимке экрана показана отправка пользовательского приложения.

    Примечание

    Если вы не можете найти параметр для отправки пользовательского приложения, обратитесь к администратору Teams.

  7. Выберите "Открыть ", чтобы отправить файл messaging.zip, созданный в папке TeamsAppManifest.

    Снимок экрана: клонированный репозиторий с ZIP-файлом сообщений.

  8. Нажмите кнопку Добавить.

    Снимок экрана: диалоговое окно сведений о приложении для добавления приложения расширения для обмена сообщениями.

  9. Нажмите "Открыть", чтобы открыть приложение в личной области.

    Вы также можете найти и выбрать нужную область или выбрать канал, чат или собрание из списка и переместиться в диалоговом окне, чтобы нажать кнопку "Перейти".

    Снимок экрана: диалоговое окно выбора области для выбора необходимой области.

Взаимодействие с приложением в Teams

  1. Выберите команду "Создать карточку " в списке команд поля создания сообщения.

    Снимок экрана: меню переполнения поля создания сообщения с выделенным красным цветом меню

  2. Введите свою информацию в модальном всплывающем окне.

    На снимке экрана показано всплывающее окно модели

  3. Выберите Отправить.

    Снимок экрана: всплывающее окно модели

  4. Выберите Дополнительные параметры (...) в меню переполнения.

  5. Выберите Дополнительные действия>Поделиться сообщением.

    На снимке экрана показано меню переполнения сообщения. Пункты

  6. Если требуется добавить изображение, установите флажок "Включить изображение в карточку героя " и нажмите кнопку "Отправить".

    Снимок экрана: расширение для сообщений действий с флажком

Пройти испытание

Вы что-то подобное придумали?

Снимок экрана: выходные данные расширения сообщений после успешного прохождения пошагового руководства.

Вы завершили руководство, чтобы приступить к работе с приложением для расширения сообщений с указаниями !

Команды действия

В начало

Создание бота с проверкой подлинности с единым входом

Боты для бесед в Microsoft Teams выполняют повторяющиеся автоматические задачи, инициируемые пользователями, например обслуживание клиентов. Пользователю необходимо выполнить вход несколько раз без проверки подлинности единого входа (SSO). Благодаря методам аутентификации с единым входом пользователям не нужно входить в бот несколько раз.


Руководство: создание бота с проверкой подлинности с единым входом

Бот ведет себя по-разному в зависимости от беседы, в которой он участвует:

  • Для ботов в каналах и групповых чатах требуется, чтобы пользователи перешли @mention в бот.
  • Боты в приватной беседе не требуют @mention. Все сообщения, отправленные пользователем, направляются в бот.

Эти пошаговые инструкции помогут вам создать бота с аутентификацией SSO. Вы увидите следующие выходные данные:

Снимок экрана: бот с выходными данными аутентификации единого входа после успешного прохождения пошагового руководства.

Необходимые условия для создания бота

Установите следующие средства и настройте среду разработки:

Установка Для использования...
Microsoft Teams Microsoft Teams для совместной работы со всеми, с кем вы работаете, с помощью приложений для чата, собраний и звонков в одном месте.
Visual Studio 2022 Вы можете установить корпоративную версию в Visual Studio 2022, а также установить рабочие нагрузки ASP.NET и веб-разработки. Используйте последнюю версию.
Учетная запись разработчика Microsoft 365 Доступ к учетной записи Teams с соответствующими разрешениями на установку приложения.
Туннель разработчика Для функций приложения Teams (боты для бесед, расширения сообщений и входящие веб-перехватчики) требуются входящие подключения. Туннель соединяет вашу систему разработки с Teams. Туннель разработчика — это мощный инструмент для безопасного открытия локального хоста в Интернете и управления доступом к нему. Туннель разработчика доступен в Visual Studio 2022 версии 17.7.0 или более поздних версиях.
или
Вы также можете использовать ngrok в качестве туннеля для подключения вашей системы разработки к Teams. Это не обязательно для приложений, которые включают только вкладки. Этот пакет устанавливается в каталоге проекта (с помощью npm devDependencies).

Примечание

Скачав ngrok, зарегистрируйтесь и установите authtoken.

Настройка клиента разработки Teams

Клиент — это своего рода пространство или контейнер, в котором вы общаетесь, обмениваетесь файлами и проводите собрания для своей организации в Teams. Вы также можете отправить и протестировать пользовательское приложение.

Проверка настраиваемого параметра отправки приложения

После создания приложения необходимо загрузить его в Teams, не распространяя его. Этот процесс называется пользовательской отправкой приложения. Войдите в свою учетную запись Microsoft 365, чтобы просмотреть этот вариант.

Примечание

Пользовательская отправка приложения необходима для предварительного просмотра и тестирования приложений в локальной среде Teams. Включите отправку приложения, чтобы предварительно просмотреть и протестировать его в Teams локально.

У вас уже есть клиент и есть права администратора? Давайте проведем проверку, действительно ли вы это делаете!

Проверка пользовательской отправки приложений в Teams:

  1. В клиенте Teams выберите значок "Приложения ".

  2. Выберите "Управление приложениями".

  3. Выберите "Отправить приложение"

  4. Найдите параметр "Отправить пользовательское приложение". Если вы видите параметр, пользовательская отправка приложений включена.

    Снимок экрана, на котором показаны приложения Teams,

Примечание

Обратитесь к администратору Teams, если у вас нет возможности отправить пользовательское приложение.

Создание бесплатного клиента для разработчиков Teams

Если у вас нет учетной записи разработчика Teams, вы можете получить ее бесплатно. Присоединяйтесь к программе Microsoft 365 для разработчиков!

  1. Перейдите в программу для разработчиков Microsoft 365.

  2. Выберите "Присоединиться сейчас" и следуйте инструкциям на экране.

  3. На экране приветствия выберите "Настройка подписки E5".

  4. Настройте учетную запись администратора. По окончании отобразится следующий экран.

    Снимок экрана: подписка на программу Microsoft 365 для разработчиков.

  5. Войдите в Teams с помощью новой учетной записи администратора, которую вы только что настроили. Убедитесь, что в Teams есть параметр "Отправить пользовательское приложение ".

Настройка локальной среды

Выполните следующие действия для клонирования репозитория:

  1. Откройте Microsoft-teams-Samples.

  2. Выберите код.

  3. В раскрывающемся меню выберите "Открыть с помощью GitHub Desktop".

    Снимок экрана: параметр клонирования репозитория в локальном репозитории.

  4. Выберите "Клонировать".

Регистрация приложения Microsoft Entra

Следующие действия помогут вам создать и зарегистрировать бота на портале Azure:

  • Создайте и зарегистрируйте приложение Azure.
  • Создайте секрет клиента, чтобы включить проверку подлинности бота с помощью единого входа.
  • Добавьте канал Teams для развертывания бота.
  • Создайте туннель к конечным точкам веб-сервера с помощью туннеля разработки (рекомендуется) или ngrok.
  • Добавьте конечную точку обмена сообщениями в созданный туннель разработки.

Добавление регистрации приложения

  1. Перейдите на портал Azure.

  2. Выберите «Регистрация приложений».

    На снимке экрана показаны службы Azure для выбора Регистрация приложений.

  3. Выберите + Новая регистрация.

    Снимок экрана: страница новой регистрации в Центре администрирования Microsoft Entra.

  4. Введите имя приложения.

  5. При необходимости выберите параметр клиента.

  6. Выберите Регистрация.

    На снимке экрана показан параметр регистрации бота в Центре администрирования Microsoft Entra.

    Ваше приложение зарегистрировано в Microsoft Entra ID. Откроется страница обзора приложения.

    На снимке экрана показана страница обзора регистрации приложения.

    Примечание

    Сохраните идентификатор приложения из идентификатора приложения (клиента) и идентификатора каталога (клиента) для дальнейшего использования.

Создание туннеля

Для создания туннеля используйте один из следующих двух способов.

  1. Откройте Visual Studio.

  2. Выберите "Создать проект".

    Снимок экрана: выбор для создания нового проекта.

  3. В поле поиска введите ASP.NET. В результатах поиска выберите веб-приложение ASP.NET Core.

  4. Нажмите кнопку Далее.

    Снимок экрана: поиск и выбор шаблона.

  5. Введите имя проекта и нажмите кнопку "Далее".

    Снимок экрана: имя проекта для входа.

  6. Нажмите кнопку Создать.

    Снимок экрана показывает дополнительные сведения о проекте.

    Откроется окно обзора.

    На снимке экрана показано окно обзора.

  7. В раскрывающемся списке отладки выберите Туннели разработчика (без активного туннеля)>Создать туннель....

    Снимок экрана: раскрывающийся список для выбора туннелей разработки.

    Появится всплывающее окно.

  8. Обновите следующие сведения во всплывающем окне:

    1. Учетная запись: введите учетную запись Майкрософт или GitHub.
    2. Имя: введите имя туннеля.
    3. Тип туннеля: в раскрывающемся списке выберите "Временный".
    4. Доступ: в раскрывающемся списке выберите "Общедоступный".

  9. Нажмите кнопку ОК.

    Снимок экрана: сведения о необходимости обновления для создания туннеля.

    Появится всплывающее окно, демонстрирующее успешное создание туннеля разработчика.

  10. Нажмите кнопку ОК.

    На снимке экрана показано всплывающее сообщение о создании туннеля.

    Созданный туннель можно найти в раскрывающемся списке отладки следующим образом:

    На снимке экрана показано, что туннель активен и выбран.

  11. Нажмите клавишу F5 , чтобы запустить приложение в режиме отладки.

  12. Если появится диалоговое окно "Предупреждение системы безопасности ", нажмите кнопку "Да".

    На снимке экрана показано диалоговое окно принятия предупреждения системы безопасности.

    Появится всплывающее окно.

  13. Нажмите кнопку Продолжить.

    Снимок экрана: URL-адрес туннеля.

    Домашняя страница туннеля разработки откроется в новом окне браузера, и туннель разработки станет активен.

    Снимок экрана: страница приветствия Dev Tunnel в браузере.

  14. Перейдите в Visual Studio, выберите View > Output.

  15. В раскрывающемся меню консоли вывода выберите Туннели разработки.

    В консоли вывода отображается URL-адрес туннеля разработки.

    Снимок экрана: URL-адрес в консоли вывода Visual Studio.

Добавление проверки подлинности через Интернет

  1. На панели слева в разделе "Управление" выберите "Проверка подлинности".

  2. Выберите "Добавить веб-платформу>".

    Снимок экрана: выбор проверки подлинности в Интернете.

  3. Введите URI перенаправления для приложения, добавив auth-end его к полному доменному имени. Например, https://your-devtunnel-domain/auth-end или https://your-ngrok-domain/auth-end

  4. В разделе "Неявное предоставление и гибридные потоки" установите флажки " Маркеры доступа " и "Маркеры идентификаторов ".

  5. Выберите "Настроить".

    Снимок экрана: параметр для добавления URI перенаправления и выбора неявного предоставления и гибридных потоков.

  6. В разделе "Интернет" выберите "Добавить URI".

  7. Введите https://token.botframework.com/.auth/web/redirect.

  8. Нажмите кнопку Сохранить.

    Снимок экрана: параметр для добавления URI перенаправления и выбора неявного предоставления и гибридных потоков.

Создание секрета клиента

Примечание

При возникновении ошибки секреты клиента блокируются политикой на уровне клиента. За дополнительными сведениями обратитесь к администратору клиента. Вместо этого можно создать сертификат. Пошаговые инструкции см. в разделе создания сертификата для регистрации приложения.

  1. На левой панели в разделе "Управление" выберите "Сертификаты & секреты".

  2. В разделе "Секреты клиента" выберите + Новый секрет клиента.

    Снимок экрана: выбор нового секрета клиента.

    Откроется окно добавления секрета клиента .

  3. Введите описание.

  4. Нажмите кнопку Добавить.

    Снимок экрана: параметр описания секрета клиента, который нужно добавить.

  5. В разделе "Значение" выберите "Копировать в буфер обмена ", чтобы сохранить значение секрета клиента для дальнейшего использования.

    Снимок экрана: параметр копирования значения секретного идентификатора клиента для копирования значения в буфер обмена.

Добавление разрешений API

  1. На левой панели выберите "Разрешения API".

  2. Выберите + добавьте разрешение.

    На снимке экрана показан параметр для выбора пункта

  3. Выберите Microsoft Graph.

  4. Выберите делегированные разрешения.

  5. Выберите User>User.Read.

  6. Выберите "Добавить разрешения".

    Снимок экрана показывает возможность выбора разрешений.

    Примечание

    • Если приложению не предоставлено согласие ИТ-администратора, пользователи должны предоставить согласие при первом использовании приложения.
    • Пользователи должны дать согласие на разрешения API только в том случае, если приложение Microsoft Entra зарегистрировано в другом клиенте.

Добавление URI идентификатора приложения

  1. На левой панели в разделе "Управление" выберите "Предоставление API".

  2. Рядом с URI идентификатора приложения выберите "Добавить".

    Снимок экрана показывает возможность добавления URI идентификатора приложения для приложения.

  3. Измените формат URI идентификатора приложения и api://botid-{AppID} нажмите кнопку "Сохранить".

    Снимок экрана: параметр для добавления URI идентификатора приложения и его сохранения.

Добавление области

  1. На левой панели в разделе "Управление" выберите "Предоставление API".

  2. Выберите + Добавьте область.

    Снимок экрана: выбор для добавления области.

  3. Введите access_as_user в качестве имени области.

  4. В разделе "Кто может предоставить согласие?" выберите Администраторы и пользователи.

  5. Обновите значения остальных полей следующим образом:

    1. Введите Teams могут получать доступ к профилю пользователя в качестве отображаемого имени согласия администратора.

    2. ВВОД Позволяет Teams вызывать веб-API приложения от имени текущего пользователя в качестве описания согласия администратора.

    3. Введите Teams может получать доступ к профилю пользователя и делать запросы от имени пользователя как отображаемое имя согласия пользователя.

    4. Ввод : разрешить Teams вызывать API этого приложения с теми же правами, что и пользователь, как описано в описании согласия пользователя.

  6. Убедитесь, что для состояния установлено значение "Включено".

  7. Нажмите кнопку "Добавить область".

    На следующем рисунке показаны поля и значения:

    Снимок экрана: значения, заполненные в поле для добавления области.

    Примечание

    Имя области должно совпадать с URI идентификатора приложения, после чего /access_as_user нужно добавить его.

    Снимок экрана: подробные сведения в области видимости.

Добавление клиентского приложения

  1. На левой панели в разделе "Управление" выберите "Предоставление API".

    В разделе "Авторизованные клиентские приложения" определите приложения, которые требуется авторизовать для веб-приложения вашего приложения.

  2. Выберите + добавьте клиентское приложение.

    На снимке экрана показан параметр

  3. Добавьте мобильное или классическое приложение Teams и веб-приложение Teams.

    1. Для мобильных устройств и настольных компьютеров Teams: введите идентификатор клиента в формате 1fec8e78-bce4-4aaf-ab1b-5451cc387264.

      Снимок экрана: мобильное или настольное приложение с идентификатором клиента.

    2. Для веб-версии Teams: введите идентификатор клиента в формате 5e3ce6c0-2b1f-4285-8d4b-75ee78787346.

      Снимок экрана показывает приложение с идентификатором клиента в Интернете.

  4. Установите флажок "Разрешенные области".

  5. Выберите "Добавить приложение".

    На снимке экрана показан параметр выбора разрешенных областей и добавления приложения.

    На следующем рисунке показан идентификатор клиента:

    Снимок экрана: выходные данные клиентских приложений.

Обновление манифеста

  1. В левой области выберите "Манифест".

  2. Задайте значение для 2 "кому" requestedAccessTokenVersion и нажмите "Сохранить".

    Снимок экрана: параметр манифеста и сведения accesstoken на портал Azure.

Создание бота

Создание ресурса бота Azure

Примечание

Если вы уже тестируете бот в Teams, выйдите из этого приложения и Teams. Чтобы увидеть это изменение, войдите в систему еще раз.

  1. Переход на главную страницу.

  2. Выберите + Создать ресурс.

  3. В поле поиска введите Azure Bot.

  4. Нажмите клавишу ВВОД.

  5. Выберите бота Azure.

  6. Нажмите кнопку Создать.

    Снимок экрана показывает создание бота Azure.

  7. Введите имя бота в поле дескриптора бота.

  8. Выберите подписку в раскрывающемся списке.

  9. Выберите группу ресурсов в раскрывающемся списке.

    Снимок экрана: параметр группы ресурсов и подписка на портале Azure.

    Если группа ресурсов отсутствует, можно создать новую. Чтобы создать новую группу ресурсов, выполните указанные ниже действия.

    1. Выберите "Создать".
    2. Введите имя ресурса и нажмите кнопку "ОК".
    3. Выберите расположение в раскрывающемся списке "Новое расположение группы ресурсов ".

    Снимок экрана: новая команда группы ресурсов на портале Azure.

  10. В разделе "Цены" выберите "Изменить план".

    Снимок экрана показывает вариант ценообразования на портале Azure.

  11. Выберите FO Free>Select.

    На снимке экрана показан вариант выбора

  12. В разделе "Идентификатор приложения Майкрософт" выберите "Тип приложения как мультитенантный".

  13. В поле "Тип создания" выберите Использовать регистрацию существующего приложения.

  14. Введите идентификатор приложения.

    Примечание

    Вы не можете создать более одного бота с одним идентификатором приложения Майкрософт.

  15. Выберите "Рецензирование + создание".

    На снимке экрана показано создание нового бота.

  16. Когда проверка пройдена, выберите "Создать".

    Для подготовки бота требуется несколько минут.

  17. Выберите "Перейти к ресурсу".

    Снимок экрана: параметр

    Вы успешно создали бота Azure.

    Снимок экрана: выходные данные бота.

Добавление канала Teams

  1. На левой панели выберите "Каналы".

  2. В разделе "Доступные каналы" выберите Microsoft Teams.

    Снимок экрана: выбор команд в каналах.

  3. Установите флажок, чтобы принять Условия обслуживания.

  4. Выберите "Принимаю".

    Снимок экрана: принятие условий обслуживания.

  5. Нажмите Применить.

    Снимок экрана: Microsoft Teams в качестве сообщений для применения.

Добавление конечной точки обмена сообщениями

Чтобы добавить конечную точку обмена сообщениями, используйте один из следующих способов.

  1. Используйте URL-адрес туннеля разработки в консоли вывода в качестве конечной точки обмена сообщениями.

    Снимок экрана: URL-адрес в консоли вывода Visual Studio.

  2. На левой панели в разделе "Параметры" выберите "Конфигурация".

  3. Обновите конечную точку обмена сообщениями в формате https://your-devtunnel-domain/api/messages.

    На снимке экрана показана конечная точка обмена сообщениями, добавляющая API.

  4. Нажмите Применить.

    Вы успешно настроили бота в службе ботов Azure.

    Примечание

    Если в ключе инструментирования Application Insights отображается ошибка, обновите его с помощью идентификатора приложения.

Добавление параметров подключения OAuth

  1. На левой панели выберите "Конфигурация".

  2. Выберите "Добавить параметры подключения OAuth".

  3. В разделе "Новый параметр подключения" обновите следующие сведения:

    • Имя: введите имя для нового параметра подключения. Вы можете использовать имя в настройках кода службы вашего бота.
    • Поставщик услуг: В раскрывающемся списке выберите Azure Active Directory v2.
    • Идентификатор клиента: Обновите идентификатор приложения Майкрософт.
    • Секрет клиента: обновление значения секретов клиента.
    • URL-адрес обмена токенами: обновите URI идентификатора приложения.
    • Идентификатор клиента: введите "общий".
    • Области: введите User.Read.

  4. Нажмите кнопку Сохранить.

    Снимок экрана: значения, добавленные для настройки подключения OAuth.

Настройка параметров приложения и файлов манифеста

  1. Перейдите к файлу appsettings.json в клонированном репозитории.

    Снимок экрана: расположение JSON-файла appsettings.

  2. Откройте файл appsettings.json и обновите следующие сведения:

    • Установите "MicrosoftAppId"идентификатор приложения Microsoft бота.
    • Установите "MicrosoftAppPassword"значение секретного идентификатора клиента вашего бота.
    • Задайте ConnectionName как имя подключения OAuth.
    • Выберите "MicrosoftAppType""Мультитенант".
    • Установите значение "Общее"MicrosoftAppTenantId"".

    Снимок экрана: элемент appsettings в формате JSON.

  3. Перейдите к файлу manifest.json в клонированном репозитории.

    Снимок экрана: выбор JSON-файла манифеста.

  4. Откройте файл manifest.json и обновите следующие изменения:

    • Замените все вхождения вашим идентификатором"{TODO: MicrosoftAppId}" приложения Майкрософт.
    • Установите "<<domain-name>>" домен ngrok или туннеля разработки.

    Снимок экрана: сведения, заполненные в файле манифеста в Visual Studio.

Сборка и запуск службы

  1. Откройте Visual Studio.

  2. Перейдите в раздел "Файл>",">Открыть проект/решение...".

    Снимок экрана: меню

  3. В папке bot-conversation-sso-quickstart>csharp_dotnetcore и выберите BotConversationSsoQuickstart.sln файл.

    Снимок экрана: файл Project с выделенным красным путем и файлом BotSSOCSharp.csproj.

  4. Нажмите клавишу F5 , чтобы запустить проект.

  5. Если появится диалоговое окно "Предупреждение системы безопасности ", нажмите кнопку "Да".

    Снимок экрана: предупреждение системы безопасности с параметром

    Откроется веб-страница с сообщением "Ваш бот готов!".

    Примечание

    Эта страница отображается только при переходе по URL-адресу localhost.

    Снимок экрана: веб-страница с сообщением

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

    Если появляется сообщение об ошибке "Не удается найти пакет ", выполните следующие действия.

    1. Перейдите в "Инструменты>", "NuGet", "Диспетчер>пакетов", "Параметры диспетчера пакетов".
    2. В появившемся окне параметров выберите"Источники пакетовNuGet диспетчер пакетов>".
    3. Нажмите кнопку Добавить.
    4. В поле Имя введите nuget.org и в поле Источник введите https://api.nuget.org/v3/index.json.
    5. Нажмите "Обновить" и "OK".
    6. Перестройте свой проект.

Отправка бота в Teams

  1. В клонированном репозитории перейдите к Microsoft-Teams-Samples>bot-conversation-sso-quickstart>>csharp_dotnetcore>TeamsApp>appPackage.

  2. Создайте файл .zip со следующими файлами, присутствующими в папке appPackage :

    • manifest.json
    • outline.png
    • color.png

    Снимок экрана: папка

  3. Перейдите в Microsoft Teams.

    1. В клиенте Teams выберите "Приложения".
    2. Выберите "Управление приложениями".
    3. Выберите "Отправить приложение".
    4. Найдите параметр для отправки пользовательского приложения.

    Снимок экрана приложения Teams со значком

  4. Нажмите кнопку "Открыть", чтобы отправить файл .zip, созданный в папке "Манифест".

    Снимок экрана: папка

  5. Выберите "Добавить ", чтобы добавить бота в чат.

    Снимок экрана: бот беседы с выделенной кнопкой

  6. Нажмите кнопку Открыть.

    Снимок экрана: диалоговое окно выбора областей с выделенной кнопкой

    Вы можете взаимодействовать с ботом, отправляя ему сообщение. Бот обменивается токеном единого входа и вызывает API Graph от вашего имени. При этом вы сможете оставаться в системе, пока не отправите сообщение с требованием выйти.

  7. Отправьте сообщение боту. Бот беседы впервые запрашивает согласие.

  8. Для настольных компьютеров: выберите "Продолжить ", чтобы предоставить клиенту Teams разрешения на доступ к боту.

    Снимок экрана: дополнительные разрешения с параметром

    Примечание

    Теперь вы настроили единый вход с помощью приложения-бота, и это единственный раз, когда вам потребуется дать согласие.

  9. Для мобильных устройств: выберите "Принять".

    Примечание

    Теперь вы настроили единый вход в приложении-боте на мобильном устройстве, и это единственный раз, когда вам потребуется дать согласие.

    Снимок экрана: выходные данные единого входа бота после успешного прохождения пошагового руководства.

Вы что-то подобное придумали?

Снимок экрана: выходные данные после успешного выполнения пошагового руководства.

Вы завершили руководство, чтобы приступить к созданию бота с проверкой подлинности единого входа.

Включение единого входа для бота

В начало

Создайте свое первое приложение расширения сообщений на JavaScript

Начните разработку приложений Microsoft Teams с вашим первым приложением Teams на JavaScript.

В этом руководстве вы узнаете:

  • Настройка нового проекта с помощью набора средств агентов Microsoft 365 (ранее известного как набор инструментов Teams).
  • Как создать приложение для расширения сообщений.
  • Развертывание приложения.
Руководство: создание первого приложения расширения сообщений на JavaScript

Это пошаговое руководство поможет вам создать расширение для обмена сообщениями приложения Teams с набором средств агентов в Visual Studio Code. После завершения этого руководства вы увидите следующие выходные данные:

Снимок экрана: окончательные выходные данные приложения расширения сообщений в Teams.

Необходимые условия

Убедитесь, что вы установили следующие инструменты для создания и развертывания приложений.

  Установка Для использования...
Обязательно    
  Visual Studio Code Среды сборки JavaScript или TypeScript. Используйте последнюю версию.
  Набор средств для агентов Microsoft 365 Расширение Microsoft Visual Studio Code, создающее шаблоны проекта для вашего приложения. Используйте последнюю версию.
  Node.js Внутренняя среда выполнения JavaScript. Дополнительные сведения см. Node.js таблице совместимости версий.
  Microsoft Teams Работайте совместно с коллегами с помощью приложений для чатов, собраний и звонков в одном месте.
  Microsoft Edge (рекомендуется) или Google Chrome Браузер с инструментами разработчика, необходимыми для отладки и тестирования.
  Учетная запись разработчика Microsoft 365 Доступ к учетной записи Teams с соответствующими разрешениями на установку пользовательского приложения.
Необязательное    
  Инструменты Azure для Visual Studio Code и интерфейс командной строки Azure Инструменты Azure для доступа к хранимым данным или для развертывания облачной серверной части для приложения Teams в Azure.
  Инструменты разработчика React для Chrome или инструменты разработчика React для Microsoft Edge Расширение DevTools для библиотеки JavaScript React с открытым кодом.

Подготовка среды разработки

После установки необходимых средств настройте среду разработки.

Установка набора средств агентов Microsoft 365

Набор средств для агентов Microsoft 365 (ранее известный как Teams Toolkit) помогает упростить процесс разработки с помощью инструментов подготовки и развертывания облачных ресурсов для приложения и публикации в магазине Teams.

Вы можете использовать Agents Toolkit с Visual Studio Code или интерфейсом командной строки под названием Microsoft 365 Agents Toolkit CLI (ранее известный как TeamsFx CLI).

  1. Откройте Visual Studio Code и выберите расширения (CTRL+SHIFT+X или просмотр>расширений).

  2. В поле поиска введите Microsoft 365 Agents Toolkit.

  3. Выберите Установить.

    Снимок экрана: установка расширения набора средств для агентов.

    Значок набора средств агентов Microsoft 365 появится на панели действий Visual Studio Code.

Вы также можете установить набор средств агентов из магазина Visual Studio Code Marketplace.

Настройка клиента разработки для Teams

Клиент — это пространство или контейнер для вашей организации в Teams, где вы общаетесь, обмениваетесь файлами и проводите собрания. В этом же пространстве можно отправить и протестировать свое приложение. Давайте проверим, готовы ли вы разрабатывать вместе с клиентом.

Проверка параметра "Загрузить приложение"

После создания пользовательского приложения необходимо отправить его в Teams с помощью параметра Загрузить пользовательское приложение . Войдите в свою учетную запись Microsoft 365, чтобы выполнить проверку, включен ли этот параметр.

Следующие шаги помогут вам проверить, можете ли вы отправлять приложения в Teams:

  1. В клиенте Teams выберите значок "Приложения ".

  2. Выберите "Управление приложениями".

  3. Выберите "Отправить приложение".

  4. Найдите параметр для отправки пользовательского приложения. Если параметр отображается, вы можете отправить пользовательские приложения.

    Снимок экрана показывает параметр для отправки пользовательского приложения в Teams.

    Примечание

    Если вы не находите возможности отправить пользовательское приложение, обратитесь к администратору Teams.

Создание бесплатного клиента для разработчиков Teams (необязательно)

Если у вас нет учетной записи разработчика Teams, присоединяйтесь к программе разработчиков Microsoft 365.

  1. Перейдите в программу для разработчиков Microsoft 365.

  2. Выберите "Присоединиться сейчас" и следуйте инструкциям на экране.

  3. На экране приветствия выберите "Настроить подписку E5".

  4. Настройте учетную запись администратора. После завершения появится следующий экран:

    Снимок экрана показывает программу для разработчиков Microsoft 365.

  5. Войдите в Teams с помощью только что настроенной учетной записи администратора. Убедитесь, что в Teams есть параметр "Отправить пользовательское приложение ".

Получите бесплатную учетную запись Azure

Если вы хотите разместить приложение или получить доступ к ресурсам в Azure, у вас должна быть подписка на Azure. Создайте бесплатную учетную запись , прежде чем начать.

Создайте рабочую область Project для приложения расширения сообщений

Теперь давайте создадим ваше первое приложение для расширения сообщений.

Возможность расширения сообщений позволяет взаимодействовать с веб-службой с помощью кнопок и форм. Используйте область создания сообщения, командное поле или сообщение непосредственно в клиенте Teams для поиска и инициирования действий во внешней системе. В расширениях сообщений используются боты, обеспечивающие диалог между пользователем и кодом.

На схеме показаны различные типы функций приложений с выделенным расширением сообщения.

Существует два типа расширений для сообщений Teams:

  • Команды поиска: Вы можете выполнять поиск во внешних системах и вставлять результаты в сообщение в виде карты.
  • Команды действий: Вы можете показать своим пользователям модальное всплывающее окно для сбора или отображения информации. Затем вы можете обработать их взаимодействие и отправить информацию обратно в Teams.

Давайте создадим приложение для расширения сообщений с помощью поисковой команды. Сначала создайте новый проект Teams для приложения расширения сообщений.

В этом руководстве вы узнаете:

  1. Настройка нового проекта расширения сообщений с помощью набора средств агентов.
  2. О структуре каталогов проекта приложения.

Создание расширения для сообщений рабочая область Project

Если все необходимые условия соблюдены, давайте начнем!

Примечание

Показанный пользовательский интерфейс Visual Studio Code может отличаться в зависимости от вашей операционной системы, версии набора средств, темы и среды.

  1. Откройте Visual Studio Code.

  2. Выберите значок набора средств для агентов Microsoft 365 на панели действий Visual Studio Code.

  3. Выберите "Создать агент или приложение>"приложения Teams.

    Снимок экрана: параметр создания нового приложения на боковой панели набора средств агентов.

  4. Выберите расширение сообщения.

    Снимок экрана: создание приложения Teams.

  5. Выберите "Настраиваемые результаты поиска".

    Снимок экрана: параметр выбора возможностей нового приложения.

  6. Выберите "Начать с бота".

    Снимок экрана: варианты архитектуры расширения для обмена сообщениями.

  7. Выберите JavaScript.

    На снимке экрана показан вариант выбора языка программирования.

  8. Выберите папку по умолчанию для сохранения корневой папки проекта в папке по умолчанию.

    Снимок экрана: выбор расположения по умолчанию.

    Вы также можете изменить расположение по умолчанию, выполнив следующие действия.

    1. Нажмите кнопку Обзор.

      Снимок экрана: параметр просмотра.

    2. Выберите расположение для рабочей области проекта.

    3. Выберите "Выбрать папку".

      Снимок экрана: выбор расположения для папки рабочей области проекта.

  9. Введите подходящее имя для приложения. Нажмите клавишу ВВОД.

    Снимок экрана показывает вариант ввода имени приложения.

    Agents Toolkit создает приложение за несколько секунд.

    На снимке экрана показано только что созданное приложение расширения сообщений.

    После создания приложения Agents Toolkit отображает следующее сообщение:

    Снимок экрана: диалоговое окно с сообщением о том, что приложение для расширения сообщений создано.

Знакомство с исходным кодом приложения расширения для сообщений

Расширение для обмена сообщениями использует Bot Framework для взаимодействия со службой посредством беседы. После формирования шаблонов просмотрите каталоги и файлы проекта в проводнике.

Снимок экрана: файлы приложения расширения для сообщений.

Папка или файл Содержание
m365agents.yml Основной файл проекта описывает конфигурацию приложения и определяет набор действий для выполнения на каждом этапе жизненного цикла.
m365agents.local.yml Переопределяет m365agents.yml действия, которые включают локальное выполнение и отладку.
.vscode/ Файлы Visual Studio Code для локальной отладки.
appPackage/ Шаблоны манифеста приложения Teams.
infra/ Шаблоны для подготовки ресурсов Azure.
index.js Точка входа и express обработчик приложения.

Совет

Ознакомьтесь с ботами и расширением сообщений за пределами Teams, прежде чем интегрировать свое приложение в Teams.

Создание и запуск первого приложения для расширения сообщений

После настройки рабочей области проекта с помощью набора средств агентов можно приступить к созданию проекта. Необходимо войти в свою учетную запись Microsoft 365.

Войдите в свою учетную запись Microsoft 365

Войдите с учетной записью администратора, созданной при присоединении к программе для разработчиков Microsoft 365.

  1. Откройте Visual Studio Code.

  2. Выберите значок набора средств для агентов Microsoft 365 на панели действий.

  3. Выберите "Войти в Microsoft 365, используя свои учетные данные". Веб-браузер по умолчанию открывается для входа в систему.

    Снимок экрана: где войти в Microsoft 365 и Azure.

  4. Закройте браузер после входа с помощью учетных данных.

  5. Вернуться к набору средств агентов в Visual Studio Code.

В разделе "Учетные записи " боковой панели отображается имя вашей учетной записи Microsoft 365. Если для вашей учетной записи Microsoft 365 включена настраиваемая отправка приложений, в наборе средств агентов отображается сообщение " Отправка пользовательских приложений включена".

На снимке экрана показан пользователь, вошедший в Microsoft 365, и сообщение о включении отправки.

Теперь вы готовы создать приложение и запустить его локально!

Создание и запуск приложения в локальной среде

Теперь вы можете локально создать и отладить свое первое приложение для расширения сообщений Teams.

Создайте и запустите приложение локально

  1. Нажмите клавишу F5 в Visual Studio Code, чтобы запустить приложение в режиме отладки.

    Примечание

    Если Agents Toolkit не удается проверить какое-либо предварительное условие, он предлагает выполнить проверку.


    Узнайте, что происходит при локальном запуске приложения в отладчике.

    При нажатии клавиши F5 набор средств агентов выполняет следующие функции:

    1. Проверяет выполнение следующих предварительных требований:

      1. Вы вошли в систему с учетной записью Microsoft 365.
      2. Для вашей учетной записи Microsoft 365 включена настраиваемая отправка приложений.
      3. Поддерживаемая версия Node.js установлена.
      4. Порт, необходимый приложению бота, доступен.

    2. Устанавливает пакеты npm

    3. Запускает Dev Tunnel, чтобы создать туннель HTTP.

    4. Регистрирует приложение в Microsoft Entra ID и настраивает приложение.

    5. Регистрирует приложение бота в Bot Framework и настраивает приложение.

    6. Регистрация приложения на портале разработчика Teams и его настройка.

    7. Запускает приложение расширения сообщений, размещенное локально.

    8. Запускает Teams в веб-браузере и загружает приложение Teams.

    Снимок экрана: процесс отладки приложения расширения сообщений.

    При первой отладке приложения Teams загружает зависимости и создает приложение. Этот процесс может занять от 3 до 5 минут.

  2. По завершении сборки Teams откроется в окне браузера. Войдите с помощью учетной записи Microsoft 365, если появится соответствующий запрос.

  3. Откроется диалоговое окно, позволяющее добавить приложение расширения сообщений в Teams. Нажмите кнопку Добавить.

    Снимок экрана: параметр добавления пользовательского приложения в Teams.

    Teams загружает приложение расширения сообщений.

    Снимок экрана: приложение расширения для сообщений, открытое в чате бота Teams.

    Поскольку приложения для расширения сообщений используют ботов для взаимодействия между пользователем и веб-службой, ваше приложение загружается в функцию чата бота.

    • Если вы создали приложение-бот до создания приложения расширения для обмена сообщениями, Teams загружает расширение для обмена сообщениями в созданное вами приложение-бот. Отображаются предыдущие сообщения чата приложения бота.
    • Если вы сначала создали расширение для сообщений, Teams загружает ваше приложение в последний чат, открытый в Teams.

Протестируйте приложение

При первой загрузке приложения расширение для обмена сообщениями открывается для тестирования. Этот пример приложения позволяет выполнять поиск пакетов npm с открытым кодом в реестре программного обеспечения.

Выполнение поискового запроса

  1. В поле поиска расширения для сообщений введите имя пакета npm с открытым исходным кодом, например CLI. Расширение для сообщений отображает список соответствующих элементов.

    Снимок экрана: строка поиска в приложении расширения для сообщений.

  2. Выберите один из элементов в списке. Приложение создаст адаптивную карточку с элементом в области создания сообщения, чтобы вы могли отправить его в чате или на канал.

    Снимок экрана: результат поиска в области создания сообщения.

  3. Нажмите клавишу ВВОД. Приложение расширения для обмена сообщениями отправляет адаптивную карточку с элементом в чат или канал.

    Снимок экрана: результат поиска, отправленный в чате.

Как открыть приложение расширения для обмена сообщениями

На предыдущем шаге вы протестировали функцию поиска приложения расширения для сообщений. Теперь ознакомьтесь с различными способами открыть приложение расширения для обмена сообщениями.

Откройте приложение из командного поля

  1. Введите / и укажите имя приложения расширения для сообщений в командном поле.

    Снимок экрана: вызов приложения для расширения сообщений.

    Приложение откроется в командном поле, и с его помощью можно выполнить запрос.

    Примечание

    • Возможность / открыть приложение расширения сообщений из командного поля работает только в новом клиенте Teams.
    • Используйте @ для открытия приложения расширения сообщений из командной строки в классическом клиенте Teams.

Откройте приложение из области создания сообщения

  1. Щелкните многоточие в нижней части области создания сообщения.

  2. Выберите приложение расширения сообщений.

    На снимке экрана показано, как открыть приложение расширения для сообщений из области составления сообщения.

    Загружается приложение расширения сообщений с параметрами для выполнения поиска.


Откройте приложение из загруженных пользовательских приложений

  1. Выберите "Приложения">Управление приложениями.

  2. Выберите раскрывающийся список для вашего приложения в списке приложений и выберите "Личное приложение".

    Снимок экрана: загруженные приложения в Teams.

  3. Появится диалоговое окно, предлагающее испробовать приложение. Если нажать кнопку "Понятно", диалоговое окно исчезнет. Выберите "Попробовать".

    Снимок экрана: сообщение, чтобы попробовать приложение для расширения сообщений сейчас или позже.

  4. Список ваших приложений для расширения сообщений отобразится в последнем чате Teams. Выберите приложение расширения сообщений из списка.

Узнайте, как устранить неполадки, если приложение не запускается локально

Чтобы запустить приложение в Teams, необходимо иметь учетную запись разработки Microsoft 365, которая разрешает настраиваемую отправку приложений. Дополнительные сведения о пользовательской загрузке приложения см. в разделе "Предварительные требования".

Развертывание первого приложения Teams

Давайте развернем ваше первое приложение для расширения сообщений в Azure с помощью набора средств агентов.

Войдите в свою учетную запись Azure

Войдите в свою учетную запись Azure, чтобы получить доступ к порталу Microsoft Azure и подготовить новые облачные ресурсы для поддержки вашего приложения.

  1. Откройте Visual Studio Code.

  2. Откройте папку проекта, в которой вы создали приложение расширения для сообщений.

  3. Выберите значок набора средств для агентов Microsoft 365 на панели действий.

  4. Выберите "Войти в Azure, используя свои учетные данные". Веб-браузер по умолчанию открывается для входа в систему.

    Совет

    Если у вас установлено расширение для УЧЕТНОЙ записи AZURE и вы используете эту же учетную запись, этот шаг можно пропустить.

  5. При появлении соответствующего запроса закройте браузер и вернитесь в Visual Studio Code.

В разделе «Учетные записи» боковой панели перечислено количество доступных вам подписок Azure. Убедитесь, что у вас есть хотя бы одна действительная подписка Azure. Если нет, выйдите и используйте другую учетную запись.

Развертывание приложения в Azure

Развертывание состоит из двух этапов. Сначала создаются необходимые облачные ресурсы (другое название — инициализация). Затем код вашего приложения копируется в созданные облачные ресурсы. В этом руководстве вы разворачиваете приложение расширения сообщений.

В чем разница между Provisioned и Deploy?
На этапе подготовки создаются ресурсы в Azure и Microsoft 365 для приложения, но код (например, HTML, CSS или JavaScript) не копируется в ресурсы. На шаге развертывания выполняется копирование кода приложения в ресурсы, созданные на этапе подготовки. Как правило, развертывание выполняется несколько раз без подготовки новых ресурсов. Так как этап подготовки занимает некоторое время, он отделен от этапа развертывания.

Выберите значок набора средств для агентов Microsoft 365 на панели действий Visual Studio Code.

  1. Выберите "Подготовка".

    Снимок экрана: выбор подготовки в облаке в наборе средств агентов.

  2. Выберите подписку.

    Снимок экрана показывает параметры группы подписки Azure на выбор.

  3. Выберите группу ресурсов.

    На снимке экрана показана подписка для использования ресурсов Azure.

    Если у вас нет группы ресурсов для выбора, вы можете создать новую группу ресурсов, выполнив следующие действия:

    1. Выберите + Создать группу ресурсов.

      На снимке экрана показан параметр создания новой группы ресурсов Azure.

    2. Выберите имя по умолчанию или введите подходящее имя для группы ресурсов.

      Снимок экрана: имя по умолчанию для новой группы ресурсов Azure.

    3. Выберите расположение для группы ресурсов.

      Снимок экрана показывает параметры расположения новой группы ресурсов Azure.

  4. Диалоговое окно предупреждает о возможных затратах при работе с ресурсами в Azure. Выберите "Подготовка".

    На снимке экрана показано диалоговое окно, предупреждающее пользователя о том, что при подготовке ресурсов Azure могут быть понесены расходы.

    Процесс подготовки создает ресурсы в облаке Azure. Это может занять некоторое время. Через несколько минут появится следующее сообщение:

    Снимок экрана: уведомление, в котором показано, что приложение для расширения сообщений успешно подготовлено в облаке.

    При желании можно просмотреть подготовленные ресурсы. В этом руководстве вам не нужно просматривать ресурсы.

    Подготовленный ресурс отображается в разделе СРЕДА.

    Снимок экрана: подготавливаемый ресурс в разделе

  5. В разделе "ЖИЗНЕННЫЙ ЦИКЛ" выберите "Развернуть".

    Снимок экрана: приложение развертывается в облаке.

  6. Появится диалоговое окно с вопросом, хотите ли вы развернуть ресурсы в среде разработки. Выберите "Развернуть".

    Снимок экрана: диалоговое окно подтверждения развертывания приложения в Azure.

    Как и в случае с подготовкой, развертывание занимает некоторое время. Через несколько минут появится сообщение о завершении работы.

Запуск развернутого приложения

После завершения этапов подготовки и развертывания перейдите в раздел "Запуск и отладка " (CTRL+SHIFT+D или просмотр > команды "Запуск") в наборе средств агентов.

  1. Выберите раскрывающееся меню "Выполнить и отладить ".

  2. Выберите "Удаленный запуск" в Teams (Microsoft Edge).

  3. Нажмите кнопку ▷ .

    На снимке экрана показан параметр удаленного запуска приложения в Teams.

  4. Откроется диалоговое окно установки развернутого приложения в Teams. Нажмите кнопку Добавить.

    Снимок экрана: сообщение о добавлении развернутого приложения.

    Teams открывает приложение расширения сообщений в последнем чате.

    На снимке экрана показано расширение для сообщений, открытое в чате.

Узнайте, что происходит при развертывании приложения в Azure

Перед развертыванием приложение выполняется локально.

  • Серверная часть выполняется с помощью основных средств Функции Azure.
  • Конечная точка HTTP приложения, где Microsoft Teams загружает приложение, выполняется локально.

Развертывание выполняется в два этапа. Вы подготавливаете ресурсы в активной подписке Azure, а затем развертываете или загружаете серверный и внешний код приложения в Azure.

  • Серверная часть, если она настроена, использует различные службы Azure, включая Службу приложений Azure и Хранилище Azure.
  • Интерфейсное приложение развертывается в учетной записи хранения Azure, настроенной для статического веб-хостинга.

Поздравляем

Вы завершили руководство по созданию приложения расширения сообщений с помощью JavaScript!

Вы что-то подобное придумали?

Снимок экрана: окончательные выходные данные приложения расширения сообщений в Teams.

Создание приложения для расширения обмена сообщениями

В начало

Создайте свое первое приложение с вкладками с помощью клавиш C sharp

Начните разработку приложения Microsoft Teams с создания вашего первого приложения Teams с возможностью вкладок.

В этом руководстве вы узнаете:

  • Как настроить новый проект.
  • Как создавать приложения с возможностью вкладок с помощью C# и Microsoft Visual Studio 2022.
Руководство: создание первого приложения с вкладками C#

Это пошаговое руководство поможет вам создать вкладку с помощью набора средств агентов Microsoft 365 (ранее известного как набор инструментов Teams). После завершения работы с этим руководством вы увидите следующие выходные данные:

Снимок экрана: окончательные выходные данные приложения вкладки Teams.

Необходимые условия для создания приложения

Ниже приведен список средств, которые необходимо установить для создания и развертывания приложения Teams.

Установка Для использования...
Microsoft Teams Microsoft Teams для совместной работы со всеми, с кем вы работаете, с помощью приложений для чата, собраний и звонков в одном месте.
Visual Studio 2022
 Вы можете установить корпоративную версию в Visual Studio 2022, а также установить рабочие нагрузки ASP.NET и веб-разработки. Используйте последнюю версию.
Набор средств для агентов Microsoft 365 Расширение Visual Studio, создающее каркас проекта для приложения. Используйте последнюю версию.

Набор средств для установки агентов

Набор средств агентов помогает упростить процесс разработки с помощью инструментов для создания шаблонов проекта для вашего приложения. Он создает необходимую структуру каталогов для всех выбранных возможностей с необходимыми файлами, готовыми к сборке проекта.

Вы можете скачать последнюю версию установщика Visual Studio. Набор средств агентов доступен в виде расширения в Visual Studio.

После открытия установщика Visual Studio во всплывающем окне рабочих нагрузок:

  1. Выберите ASP.NET и веб-разработка.

  2. В разделе сведений об> установкеНеобязательно, выберите средства разработки для Microsoft Teams.

  3. Выберите Установить.

    Снимок экрана: установка Visual Studio.

  4. Нажмите кнопку "Запустить". Откроется окно приложения Visual Studio 2022.

    Снимок экрана: выбор параметра

  5. Перейдите в раздел "Расширения">"Управление расширениями".

    Снимок экрана: выбор расширений.

    Откроется окно "Управление расширением":

    Снимок экрана: управление расширениями.

  6. На панели слева выберите "Установлено". Доступно расширение набора средств для агентов Microsoft 365.

    Снимок экрана: выбор набора средств для агентов.

Настройка клиента разработки для Teams

Клиент — это своего рода пространство или контейнер для вашей организации в Teams, где можно общаться, обмениваться файлами и проводить собрания. В этом же пространстве вы отправляете и тестируете свое пользовательское приложение. Давайте проверим, готовы ли вы разрабатывать вместе с клиентом.

Проверка параметра отправки пользовательского приложения

После создания приложения необходимо загрузить его в Teams, не распространяя его. Этот процесс называется пользовательской отправкой приложения. Войдите в свою учетную запись Microsoft 365, чтобы просмотреть этот вариант.

Примечание

Пользовательская отправка приложения необходима для предварительного просмотра и тестирования приложений в локальной среде Teams. Если она не включена, вы не сможете предварительно просмотреть и протестировать приложение в локальной среде Teams.

У вас уже есть клиент и права администратора? Давайте проведем проверку, если вы это сделаете!

Проверьте, можете ли вы загрузить пользовательские приложения в Teams:

  1. Откройте Microsoft Teams и выберите значок "Приложения ".

  2. Выберите "Управление приложениями".

  3. Выберите "Отправить приложение".

  4. Найдите параметр "Загрузить пользовательское приложение ". Если вы видите параметр, пользовательская отправка приложений включена.

    На рисунке показан параметр отправки пользовательского приложения в Teams.

Примечание

Если вы не находите возможности отправить пользовательское приложение, обратитесь к администратору Teams.

Создание бесплатного клиента для разработчиков Teams (необязательно)

Если у вас нет учетной записи Teams, вы можете получить ее бесплатно. Присоединяйтесь к программе Microsoft 365 для разработчиков!

  1. Перейдите в программу для разработчиков Microsoft 365.

  2. Выберите "Присоединиться сейчас" и следуйте инструкциям на экране.

  3. На экране приветствия выберите "Настройка подписки E5".

  4. Настройте учетную запись администратора. После завершения появится следующий экран:

    Снимок экрана показывает пример того, что вы видите после регистрации в программе для разработчиков Microsoft 365.

  5. Войдите в Teams с помощью настроенной учетной записи администратора. Убедитесь, что в Teams включена опция "Отправить пользовательское приложение ".

Получите бесплатную учетную запись Azure

Если вы хотите разместить приложение или получить доступ к ресурсам в Azure, вам потребуется подписка на Azure. Создайте бесплатную учетную запись, прежде чем начать.

Теперь у вас есть все инструменты для настройки учетной записи. Далее давайте настроим вашу среду разработки и начнем создавать! Сначала выберите приложение, которое нужно создать.

Создайте рабочую область проекта для приложения вкладок с помощью клавиши C решетки

Начните разработку приложений для Microsoft Teams с создания своего первого приложения. Это приложение использует возможность вкладок. Если все необходимые условия соблюдены, давайте начнем!

Следующие действия помогут вам создать рабочую область Project для приложения вкладок в Visual Studio:

  1. Откройте Visual Studio.

  2. Выберите "Создать проект".

    Снимок экрана: выбор нового проекта в Visual Studio.

  3. В поле поиска введите Teams.

  4. Выберите "Агенты>Microsoft 365Далее".

    Снимок экрана: выбор команд.

  5. Введите следующие сведения для настройки нового проекта.

  6. Введите обязательное имя проекта в поле "Имя проекта".

  7. Выберите необходимое расположение для сохранения файлов и папок проекта.

  8. Нажмите кнопку Создать.

    Снимок экрана показывает создание имени проекта.

  9. Выберите "Создать вкладку".>

    Снимок экрана: выбор вкладки.

Приложение вкладки Teams создается за несколько секунд.

Снимок экрана с изображением создания проекта.

Создайте и запустите ваше первое приложение с вкладками с помощью клавиши C sharp

После настройки рабочей области проекта с помощью набора средств агентов создайте приложение вкладок.

Войдите в свою учетную запись Microsoft 365

Используйте учетную запись Microsoft 365 для входа в Teams. Если вы используете клиент программы для разработчиков Microsoft 365, учетная запись администратора, которую вы настраиваете при регистрации, — это учетная запись Microsoft 365.

  1. В обозревателе решений в разделе "Решение" MyTeamsApp щелкните правой кнопкой мыши MyTeamsApp.

  2. Выберите набор >инструментов для агентов Microsoft 365Выберите учетную запись Microsoft 365.

    Снимок экрана: выбор зависимостей приложений Teams.

  3. Выберите "Учетная запись> Microsoft 365продолжить".

    Снимок экрана: выбор учетной записи M365.

Сборка и запуск приложения локально в Visual Studio

Для локальной сборки и запуска приложения выполните следующие действия.

  1. Выберите "Отладка>","Начать отладку" или нажмите клавишу F5.

    Снимок экрана: выбор действия запуска отладки.

    Visual Studio запускает процесс отладки и открывает веб-клиент Teams в браузере. Если потребуется, войдите с помощью учетной записи Microsoft 365.

  2. Нажмите кнопку Добавить.

    Снимок экрана: диалоговое окно сведений о приложении для добавления приложения вкладки в Teams.

  3. Нажмите "Открыть", чтобы открыть приложение в личной области.

Вы также можете выполнить поиск и выбрать нужную область или выбрать канал или чат из списка и переместиться в диалоговом окне, чтобы нажать кнопку "Перейти".

Снимок экрана отображает диалоговое окно выбора областей со списком общих областей.

Поздравляем! Ваше первое приложение вкладок работает в Teams!

Снимок экрана: окончательные выходные данные приложения вкладки Teams.

Узнайте, как устранить неполадки, если приложение не запускается локально.

Чтобы успешно запустить приложение в Teams, включите отправку настраиваемых приложений в учетной записи Teams. Дополнительные сведения о пользовательской загрузке приложения см. в разделе " Предварительные требования ".

Вы успешно создали приложение вкладок с помощью C#. Набор средств агентов добавил необходимые шаблоны в структуру каталогов вашего приложения. На этом руководство завершено.

Создание вкладки

Создание проекта Teams с помощью набора средств агентов Microsoft 365

В начало

Добавление единого входа на вкладку и в приложение для расширения сообщений

Единый вход (SSO) Microsoft Entra обеспечивает простую проверку подлинности пользователей в Teams.

Основные аспекты единого входа Microsoft Entra:

  • Позволяет пользователю автоматически входить в систему после первого входа.
  • Позволяет пользователю входить на другие устройства, не вводя учетные данные повторно.
  • Получает маркер для вошедшего в систему пользователя.
Руководство: добавление единого входа во вкладку и приложение для расширения сообщений

Это пошаговое руководство поможет вам создать вкладки и расширения сообщений, поддерживающие аутентификацию единого входа Microsoft Entra. Вы увидите следующие выходные данные:

Снимок экрана: вкладка и расширение сообщения с выводом проверки подлинности единого входа после успешного прохождения пошагового руководства.

Необходимые условия для добавления единого входа в приложения

Установите следующие средства и настройте среду разработки:

# Установка Для использования...
1. Microsoft Teams Microsoft Teams для совместной работы со всеми, с кем вы работаете, с помощью приложений для чата, собраний и звонков в одном месте.
2. Учетная запись разработчика Microsoft 365 Доступ к учетной записи Teams с соответствующими разрешениями на установку приложения.
3. Пакет SDK для .NET Core Настраиваемые привязки для локальной отладки и развертывания приложений Функции Azure. Если вы еще не установили последнюю версию, установите портативную версию.
4. Visual Studio 2022 Вы можете установить корпоративную версию в Visual Studio 2022, а также установить рабочие нагрузки ASP.NET и веб-разработки. Используйте последнюю версию.
5. Туннель разработчика Для функций приложения Teams (боты для бесед, расширения сообщений и входящие веб-перехватчики) требуются входящие подключения. Туннель соединяет вашу систему разработки с Teams. Туннель разработчика — это мощный инструмент для безопасного открытия локального хоста в Интернете и управления доступом к нему. Туннель разработчика доступен в Visual Studio 2022 версии 17.7.0 или более поздних версиях.
или
Вы также можете использовать ngrok в качестве туннеля для подключения вашей системы разработки к Teams. Это не обязательно для приложений, которые включают только вкладки. Этот пакет устанавливается в каталоге проекта (с помощью npm devDependencies).

Примечание

Скачав ngrok, зарегистрируйтесь и установите authtoken.

Настройка локальной среды

  1. Откройте Microsoft-teams-Samples.

  2. Выберите код.

  3. В раскрывающемся меню выберите "Открыть с помощью GitHub Desktop".

    Снимок экрана: параметр клонирования репозитория в локальном репозитории.

  4. Выберите "Клонировать".

Регистрация приложения Microsoft Entra

Следующие шаги помогут вам создать и зарегистрировать бота на портале Azure:

  • Создайте и зарегистрируйте приложение Azure.
  • Создайте секрет клиента, чтобы включить проверку подлинности бота с помощью единого входа.
  • Добавьте канал Teams для развертывания бота.
  • Создайте туннель к конечным точкам веб-сервера с помощью туннеля разработки (рекомендуется) или ngrok.
  • Добавьте конечную точку обмена сообщениями в созданный туннель разработки.

Добавление регистрации приложения

  1. Перейдите на портал Azure.

  2. Выберите «Регистрация приложений».

    На снимке экрана показаны службы Azure для выбора Регистрация приложений.

  3. Выберите + Новая регистрация.

    Снимок экрана: страница новой регистрации в Центре администрирования Microsoft Entra.

  4. Введите имя приложения.

  5. Выберите учетные записи в любом каталоге организации (любой клиент Microsoft Entra ID — многоклиентский).

  6. Выберите Регистрация.

    На снимке экрана показан параметр регистрации бота в Центре администрирования Microsoft Entra.

    Ваше приложение зарегистрировано в Microsoft Entra ID. Откроется страница обзора приложения.

    На снимке экрана показана страница обзора регистрации приложения.

    Примечание

    Сохраните идентификатор приложения из идентификатора приложения (клиента) и идентификатора каталога (клиента) для дальнейшего использования.

Создание туннеля

Выберите один из следующих способов создания туннеля:

  1. Откройте Visual Studio.

  2. Выберите "Создать проект".

    Снимок экрана: выбор для создания нового проекта.

  3. В поле поиска введите ASP.NET. В результатах поиска выберите веб-приложение ASP.NET Core.

  4. Нажмите кнопку Далее.

    Снимок экрана: поиск и выбор шаблона.

  5. Введите имя проекта и нажмите кнопку "Далее".

    Снимок экрана: имя проекта для входа.

  6. Нажмите кнопку Создать.

    Снимок экрана показывает дополнительные сведения о проекте.

    Откроется окно обзора.

    На снимке экрана показано окно обзора.

  7. В раскрывающемся списке отладки выберите Туннели разработчика (без активного туннеля)>Создать туннель....

    Снимок экрана: раскрывающийся список для выбора туннелей разработки.

    Появится всплывающее окно.

  8. Обновите следующие сведения во всплывающем окне:

    1. Учетная запись: введите учетную запись Майкрософт или GitHub.
    2. Имя: введите имя туннеля.
    3. Тип туннеля: в раскрывающемся списке выберите "Временный".
    4. Доступ: в раскрывающемся списке выберите "Общедоступный".

  9. Нажмите кнопку ОК.

    Снимок экрана: сведения о необходимости обновления для создания туннеля.

    Появится всплывающее окно, демонстрирующее успешное создание туннеля разработчика.

  10. Нажмите кнопку ОК.

    На снимке экрана показано всплывающее сообщение о создании туннеля.

    Созданный туннель можно найти в раскрывающемся списке отладки следующим образом:

    На снимке экрана показано, что туннель активен и выбран.

  11. Нажмите клавишу F5 , чтобы запустить приложение в режиме отладки.

  12. Если появится диалоговое окно "Предупреждение системы безопасности ", нажмите кнопку "Да".

    На снимке экрана показано диалоговое окно принятия предупреждения системы безопасности.

    Появится всплывающее окно.

  13. Нажмите кнопку Продолжить.

    Снимок экрана: URL-адрес туннеля.

    Домашняя страница туннеля разработки откроется в новом окне браузера, и туннель разработки станет активен.

    Снимок экрана: страница приветствия Dev Tunnel в браузере.

  14. Перейдите в Visual Studio и выберите "Просмотр > вывода".

  15. В раскрывающемся меню консоли вывода выберите Туннели разработки.

    В консоли вывода отображается URL-адрес туннеля разработки.

    Снимок экрана: URL-адрес в консоли вывода Visual Studio.

Добавление проверки подлинности в Интернете

  1. На панели слева в разделе "Управление" выберите "Проверка подлинности".

  2. Выберите "Добавить веб-платформу>".

    Снимок экрана: выбор проверки подлинности в Интернете.

  3. Введите URI перенаправления для приложения, добавив auth-end его к полному доменному имени. Например, https://your-devtunnel-domain/auth-end или https://your-ngrok-domain/auth-end

  4. В разделе "Неявное предоставление и гибридные потоки" установите флажки " Маркеры доступа " и "Маркеры идентификаторов ".

  5. Выберите "Настроить".

    На снимке экрана показана возможность добавления URI перенаправления и выбора неявного предоставления и гибридных потоков.

  6. В разделе "Интернет" выберите "Добавить URI".

  7. Введите https://token.botframework.com/.auth/web/redirect.

  8. Нажмите кнопку Сохранить.

    Снимок экрана: параметр для добавления URI перенаправления и выбора неявного предоставления и гибридных потоков.

Создание секрета клиента

Примечание

При возникновении ошибки секреты клиента блокируются политикой на уровне клиента. За дополнительными сведениями обратитесь к администратору клиента. Вместо этого можно создать сертификат. Пошаговые инструкции см. в разделе создания сертификата для регистрации приложения.

  1. На левой панели в разделе "Управление" выберите "Сертификаты & секреты".

  2. В разделе "Секреты клиента" выберите + Новый секрет клиента.

    Снимок экрана: выбор нового секрета клиента.

    Откроется окно добавления секрета клиента .

  3. Введите описание.

  4. Нажмите кнопку Добавить.

    Снимок экрана: параметр описания секрета клиента, который нужно добавить.

  5. В разделе "Значение" выберите "Копировать в буфер обмена ", чтобы сохранить значение секрета клиента для дальнейшего использования.

    Снимок экрана: параметр копирования значения секретного идентификатора клиента для копирования значения в буфер обмена.

Добавление разрешений API

  1. На левой панели выберите "Разрешения API".

  2. Выберите + добавьте разрешение.

    На снимке экрана показан параметр для выбора пункта

  3. Выберите Microsoft Graph.

  4. Выберите делегированные разрешения.

  5. Выберите User>User.Read.

  6. Выберите "Добавить разрешения".

    Снимок экрана: параметр выбора разрешений.

    Примечание

    • Если приложению не предоставлено согласие ИТ-администратора, пользователи должны предоставить согласие при первом использовании приложения.
    • Пользователи должны дать согласие на разрешения API только в том случае, если приложение Microsoft Entra зарегистрировано в другом клиенте.

Добавление URI идентификатора приложения

  1. На левой панели в разделе "Управление" выберите "Предоставление API".

  2. Рядом с URI идентификатора приложения выберите "Добавить".

    Снимок экрана показывает возможность добавления URI идентификатора приложения.

  3. Обновите URI идентификатора приложения в api://your-devtunnel-domain/botid-{AppID} формате или api://your-ngrok-domain/botid-{AppID} и нажмите "Сохранить".

    Снимок экрана показывает параметр для добавления URI перенаправления и сохранения.

    На следующем рисунке показано доменное имя.

    Снимок экрана: универсальный код ресурса (URI) перенаправления.

Добавление области

  1. На левой панели в разделе "Управление" выберите "Предоставление API".

  2. Выберите + Добавьте область.

    На снимке экрана показано, как добавить область.

  3. Введите access_as_user в качестве имени области.

  4. В разделе "Кто может предоставить согласие?" выберите Администраторы и пользователи.

  5. Обновите значения остальных полей следующим образом:

    • Введите Teams могут получать доступ к профилю пользователя в качестве отображаемого имени согласия администратора.

    • ВВОД Позволяет Teams вызывать веб-API приложения от имени текущего пользователя в качестве описания согласия администратора.

    • Введите Teams может получать доступ к профилю пользователя и делать запросы от имени пользователя как отображаемое имя согласия пользователя.

    • Ввод : разрешить Teams вызывать API этого приложения с теми же правами, что и пользователь, как описано в описании согласия пользователя.

  6. Убедитесь, что для состояния установлено значение "Включено".

  7. Нажмите кнопку "Добавить область".

    На следующем рисунке показаны поля и значения:

    На снимке экрана показаны значения, заполненные в поле для добавления области.

    Примечание

    Имя области должно совпадать с URI идентификатора приложения, после чего /access_as_user нужно добавить его.

    На снимке экрана показаны подробные сведения в области применения.

Добавление клиентского приложения

  1. На левой панели в разделе "Управление" выберите "Предоставление API".

    В разделе "Авторизованные клиентские приложения" определите приложения, которые требуется авторизовать для веб-приложения вашего приложения.

  2. Выберите + добавьте клиентское приложение.

    На снимке экрана показан параметр

  3. Добавьте мобильное или классическое приложение Teams и веб-приложение Teams.

    1. Для мобильных устройств и настольных компьютеров Teams: введите идентификатор клиента в формате 1fec8e78-bce4-4aaf-ab1b-5451cc387264.

      Снимок экрана: мобильное или настольное приложение с идентификатором клиента.

    2. Для веб-версии Teams: введите идентификатор клиента в формате 5e3ce6c0-2b1f-4285-8d4b-75ee78787346.

      Снимок экрана показывает приложение с идентификатором клиента в Интернете.

  4. Установите флажок "Разрешенные области".

  5. Выберите "Добавить приложение".

    На снимке экрана показан параметр выбора разрешенных областей и добавления приложения.

    На следующем рисунке показан идентификатор клиента:

    Снимок экрана: выходные данные клиентских приложений.

Обновление манифеста

  1. В левой области выберите "Манифест".

  2. Задайте значение для 2 "кому" requestedAccessTokenVersion и нажмите "Сохранить".

    Снимок экрана: параметр манифеста и сведения accesstoken на портал Azure.

Создание бота

Создание ресурса бота Azure

Примечание

Если вы уже тестируете бот в Teams, выйдите из этого приложения и Teams. Чтобы увидеть это изменение, войдите в систему еще раз.

  1. Переход на главную страницу.

  2. Выберите + Создать ресурс.

  3. В поле поиска введите Azure Bot.

  4. Нажмите клавишу ВВОД.

  5. Выберите бота Azure.

  6. Нажмите кнопку Создать.

    Снимок экрана показывает создание бота Azure.

  7. Введите имя бота в поле дескриптора бота.

  8. Выберите подписку в раскрывающемся списке.

  9. Выберите группу ресурсов в раскрывающемся списке.

    Снимок экрана: параметр группы ресурсов и подписка на портале Azure.

    Если группа ресурсов отсутствует, можно создать новую. Чтобы создать новую группу ресурсов, выполните указанные ниже действия.

    1. Выберите "Создать".
    2. Введите имя ресурса и нажмите кнопку "ОК".
    3. Выберите расположение в раскрывающемся списке "Новое расположение группы ресурсов ".

    Снимок экрана: новая команда группы ресурсов на портале Azure.

  10. В разделе "Цены" выберите "Изменить план".

    Снимок экрана показывает вариант ценообразования на портале Azure.

  11. Выберите FO Free>Select.

    На снимке экрана показан вариант выбора

  12. В разделе "Идентификатор приложения Майкрософт" выберите "Тип приложения как мультитенантный".

  13. В поле "Тип создания" выберите Использовать регистрацию существующего приложения.

  14. Введите идентификатор приложения.

    Примечание

    Вы не можете создать более одного бота с одним идентификатором приложения Майкрософт.

  15. Выберите "Рецензирование + создание".

    На снимке экрана показано создание нового бота.

  16. Когда проверка пройдена, выберите "Создать".

    Для подготовки бота требуется несколько минут.

  17. Выберите "Перейти к ресурсу".

    Снимок экрана: параметр

    Вы успешно создали бота Azure.

    Снимок экрана: выходные данные бота.

Добавление канала Teams

  1. На левой панели выберите "Каналы".

  2. В разделе "Доступные каналы" выберите Microsoft Teams.

    Снимок экрана: выбор команд в каналах.

  3. Установите флажок, чтобы принять Условия обслуживания.

  4. Выберите "Принимаю".

    Снимок экрана: принятие условий обслуживания.

  5. Нажмите Применить.

    Снимок экрана: Microsoft Teams в качестве сообщений для применения.

Добавление конечной точки обмена сообщениями

  1. Используйте URL-адрес туннеля разработки в консоли вывода в качестве конечной точки обмена сообщениями.

    Снимок экрана: URL-адрес в консоли вывода Visual Studio.

  2. На левой панели в разделе "Параметры" выберите "Конфигурация".

  3. Обновите конечную точку обмена сообщениями в формате https://your-devtunnel-domain/api/messages.

    На снимке экрана показана конечная точка обмена сообщениями, добавляющая API.

  4. Нажмите Применить.

    Вы успешно настроили бота в службе ботов Azure.

    Примечание

    Если в ключе инструментирования Application Insights отображается ошибка, обновите его с помощью идентификатора приложения.

Добавление параметров подключения OAuth

  1. На левой панели выберите "Конфигурация".

  2. Выберите "Добавить параметры подключения OAuth".

  3. В разделе "Новый параметр подключения" обновите следующие сведения:

    • Имя: введите имя для нового параметра подключения. Вы можете использовать имя в настройках кода службы вашего бота.
    • Поставщик услуг: В раскрывающемся списке выберите Azure Active Directory v2.
    • Идентификатор клиента: Обновите идентификатор приложения Майкрософт.
    • Секрет клиента: обновление значения секретов клиента.
    • URL-адрес обмена токенами: обновите URI идентификатора приложения.
    • Идентификатор клиента: введите "общий".
    • Области: введите User.Read.

  4. Нажмите кнопку Сохранить.

    Снимок экрана: значения, добавленные для настройки подключения OAuth.

Настройка параметров приложения

  1. Перейдите к файлу appsettings.json в клонированном репозитории.

    Снимок экрана: файл Project с файлом appsettings.json выделенным красным цветом.

  2. Откройте файл appsettings.json в Visual Studio.

  3. Обновите следующую информацию:

    • Замените "MicrosoftAppId" на идентификатор приложения Майкрософт бота.
    • Заменяйте "MicrosoftAppPassword" на секреты клиента вашего бота Значение.
    • Замените "SiteUrl" на ваш ngrok URL.
    • Замените "ConnectionName" на имя параметра подключения OAuth.
    • Замените "TenantId" на идентификатор клиента, в котором используется приложение.
    • Замените "ClientId" на идентификатор приложения Майкрософт бота.
    • Заменяйте "AppSecret" на секреты клиента вашего бота Значение.
    • Замените "ApplicationIdURI" в виде api://*******.ngrok.io/botid-{AppID}.

    Снимок экрана: файл appsettings.json, в котором введенные значения выделены красным цветом.

Настройка файла манифеста

  1. Перейдите к файлу manifest.json в клонированном репозитории.

    Снимок экрана: папка

  2. Откройте файл manifest.json в Visual Studio и внесите следующие изменения:

    • Замените DOMAIN-NAME на ваш ngrok URL.

    • Замените YOUR-MICROSOFT-APP-ID его идентификатором приложения Майкрософт бота.

      Примечание

      В зависимости от сценария [YOUR-MICROSOFT-APP-ID] и [DOMAIN-NAME] может возникать несколько раз.

    • Заменить resource как api://*******.ngrok.io/botid-{AppID}.

      Снимок экрана: файл manifest.json, в котором введенные значения выделены красным цветом.

Сборка и запуск службы

Для сборки и запуска службы используйте Visual Studio или командную строку.

  1. Откройте Visual Studio.

  2. Выберите"Открыть>файл>" *Проект/Решение...

    Снимок экрана: меню

  3. В папке csharp выберите файл App SSO Sample.csproj .

    Снимок экрана: файл Project с выделенным красным цветом файл SSO приложения.csproj.

  4. Нажмите клавишу F5, чтобы запустить проект.

  5. Нажмите "Да ", если появится следующее диалоговое окно:

    Снимок экрана: предупреждение системы безопасности с параметром

Появится веб-страница с сообщением "Ваш бот готов!

Снимок экрана: веб-страница с сообщением

В начало

  • Last updated on