Учебники

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

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

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

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

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

Предварительные условия

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

Примечание.

• Платформа агентов доступна только в microsoft 365 Agent Toolkit версии 5.4.0 (ранее известной как Набор средств Teams).
• Агенты Playground поддерживается только для настольных и веб-клиентов.

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

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

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

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

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

Создание рабочей области проекта бота

Если предварительные требования выполнены, давайте начнем!

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

2. Щелкните значок Microsoft 365 Agents Toolkit (Набор средств microsoft 365 Agents Toolkit) на панели действий Visual Studio Code.

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

   

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

   

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

   

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

   

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

   

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

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

      

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

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

      

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

   

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

   

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

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

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

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

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

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

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

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

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

   

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

   

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

   

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

   

7. Нажмите Создать.

   

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

Примечание.

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

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

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

   

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

   

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

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

   

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

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

   

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

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

      Примечание.

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

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

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

      

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

      

Обновление ключа и конечных точек 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. Перейдите в файл app.jssrc>.

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

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

   
   // Use OpenAI
   // apiKey: config.openAIKey,
   // defaultModel: "gpt-3.5-turbo",
   
   azureApiKey: config.azureOpenAIKey,
   azureDefaultDeployment: "gpt-35-turbo",
   azureEndpoint: config.azureOpenAIEndpoint,
   
   

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

1. В левой области выберите ВЫПОЛНИТЬ и ОТЛАДКА (CTRL+SHIFT+D), а затем в раскрывающемся списке выберите Отладка на детской площадке агентов .

   

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

   

Триггеры действий

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

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

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

Категория	Действие	Обработчик
Активация действия обновления установки	Установка бота Удаление бота	onInstallationUpdate onInstallationUpdateAdded onInstallationUpdate onInstallationUpdateRemove
Активация действия обновления беседы	Добавление пользователя Добавление бота Добавление канала	onMembersAdded onTeamsMembersAddedEvent onMembersAdded onTeamsMembersAddedEvent onTeamsChannelCreatedEvent
	Удаление пользователя Удаление бота Удаление канала Удаление команды	onMembersRemoved onTeamsMembersRemovedEvent onMembersRemoved onTeamsMembersRemovedEvent onTeamsChannelDeletedEvent onTeamsTeamDeletedEvent
	Переименование канала Переименование команды	onTeamsChannelRenamedEvent onTeamsTeamRenamedEvent

Примечание.

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

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

Чтобы имитировать действие add user , сделайте следующее:

1. На вкладке Агенты Playground выберите Mock an Activity> Add user (Макет действияДобавить пользователя).

   

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

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

   

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

   

Триггеры пользовательских действий

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

1. Выберите Макет пользовательского>действия действия.

   

2. Добавьте messageReaction для настройки действия в свойстве type :

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

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

   

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

   

Выполнение задачи

Вы придумали такие выходные данные?

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

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

Учебники

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

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

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

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

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

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

Предварительные условия

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

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

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

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

Установка microsoft 365 Agents Toolkit

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

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

Visual Studio Code

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

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

3. Нажмите кнопку Установить.

   

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

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

Командная строка

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

npm install -g @microsoft/m365agentstoolkit-cli

В зависимости от конфигурации может потребоваться использовать sudo для установки интерфейса командной строки:

sudo npm install -g --unsafe-perm @microsoft/m365agentstoolkit-cli

Это условие чаще встречается в системах Linux и macOS.

Убедитесь, что вы добавили глобальный кэш npm в PATH. Этот шаг обычно выполняется в рамках установщика Node.js.

С командой можно использовать cli atk . Убедитесь, что команда работает, выполнив командуatk -h .

Предостережение

Перед запуском TeamsFx в терминалах PowerShell необходимо включить политику удаленного подписанного выполнения для PowerShell.

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

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

Проверка параметра отправки приложения

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

Следующие действия помогут вам проверить, можно ли отправлять приложения в Teams.

1. В клиенте Teams щелкните значок Приложения .

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

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

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

   

   Примечание.

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

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

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

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

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

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

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

   

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

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

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

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

2. Щелкните значок Microsoft 365 Agents Toolkit на панели действий Visual Studio Code.

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

   

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

   

5. Нажмите Создать.

   

6. Выберите Папка по умолчанию , чтобы сохранить корневую папку проекта в расположении по умолчанию.

   

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

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

      

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

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

      

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

   :::

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

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

   

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

9. Нажмите Добавить.

   

10. Найдите и выберите необходимый область или выберите канал, чат или собрание из списка, а затем перейдите через диалоговое окно, чтобы выбрать Перейти.

    

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

    

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

    

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

    

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

Набор средств агентов предоставляет компоненты для создания приложения. После создания проекта можно просмотреть папки и файлы проекта в области проводника 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 Майкрософт и подготовки новых облачных ресурсов для поддержки приложения.

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

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

3. Щелкните значок Microsoft 365 Agents Toolkit на панели действий Visual Studio Code.

4. Выберите Войти, чтобы Azure с помощью учетных данных.

   Совет

   Если у вас установлено расширение учетной записи AZURE и вы используете ту же учетную запись, этот шаг можно пропустить.

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

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

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

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

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

В чем разница между подготовкой и развертыванием?

Подготовка создает ресурсы в Azure и Microsoft 365 для приложения, но код (HTML, CSS и JavaScript) не копируется в ресурсы.
При развертывании код приложения копируется в ресурсы, созданные во время подготовки. Обычно развертывание выполняется несколько раз без подготовки новых ресурсов. Так как подготовка может занять некоторое время, она отделена от развертывания.

Visual Studio Code

1. Щелкните значок Microsoft 365 Agents Toolkit на панели действий Visual Studio Code.

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

   

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

   

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

   

   Примечание.

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

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

   

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

   

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

   

7. Нажмите Развернуть.

   

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

   

8. Откройте панель отладки (CTRL+SHIFT+D️ / ⇧-D или Просмотр>запуска) из Visual Studio Code.

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

   

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

10. Нажмите Добавить.

    

11. Найдите и выберите необходимый область или выберите канал, чат или собрание из списка, а затем перейдите через диалоговое окно, чтобы выбрать Перейти.

    

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

    

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

    

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

    

Командная строка

В окне терминала:

1. Выполните команду atk new , чтобы создать новый проект.

atk new

1. Выполните команду atk provision , чтобы создать ресурс Azure.

atk provision

1. Запустите atk deploy , чтобы развернуть приложение.

atk deploy

1. Запустите atk preview , чтобы запустить приложение.

atk preview

Выполнение задачи

Ты придумала что-то вроде этого?

Вы завершили сценарий.

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

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

Учебники

Создание расширения сообщений на основе 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 Description (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. Настройте свою учетную запись администратора. После завершения отобразится следующий экран.

   

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 и не (swagger.io).

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

• Текст запроса, если он присутствует, должен быть приложением или Json, чтобы обеспечить совместимость с широким спектром API.

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

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

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

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

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

• Для операции не должны требоваться параметры заголовка или файла 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 допустимым. Чтобы проверить, выполните следующие действия.

1. Перейдите в раздел Проверяющий элемент Swagger или OpenAPI и проверьте документ Описание OpenAPI.

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

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

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

5. В области справа выберите GET.

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

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

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

   

9. Перейдите в разделТекст ответа>сервера.

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

    

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

Для документа Описание OpenAPI требуется шаблон отрисовки ответа, чтобы приложение отвечало на запросы 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. Перейдите в редактор примеров данных и вставьте ранее сохраненный ответ GET API.

      

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

      

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

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

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

Предварительный просмотр шаблона карта

   "previewCardTemplate": {
        "title": "${if(name, name, 'N/A')}",
        "subtitle": "$${if(price, price, 'N/A')}"
    } 

Создайте условие if для title и subtitle, где:

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

Например, "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. Обновите свойства в шаблоне отрисовки ответа следующим образом:

   #	Имя свойства	Значение
   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 это средства is. Дополнительные сведения об определении пути JSON см. в разделе Запрос JSON с помощью пути JSON.
   4.	"responseLayout"	"list" responseLayout указывает макет вложений. Используется для ответов типа result. Поддерживаемые типы: список и сетка. Если текст ответа содержит объект с несколькими элементами, такими как текст, заголовок и изображение, то макет ответа должен иметь значение list. Если ответ API содержит только изображения или эскизы, то для макета ответа необходимо задать значение grid.
   5.	"responseCardTemplate"	Вставьте код шаблона адаптивной карточки, сохраненный ранее. responseCardTemplate — это шаблон адаптивной карточки для сопоставления ответа JSON с адаптивной карточкой.
   6.	"previewCardTemplate"	Вставьте код шаблона предварительного просмотра карта, сохраненный ранее. previewCardTemplate— это предварительная версия карта шаблон используется для отображения результатов предварительного просмотра во всплывающем элементе расширения сообщения.

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

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

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

{
    "$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-файл. ZIP-файл должен содержать следующие файлы:

     • Документ с описанием OpenAPI
     • Шаблон отрисовки ответа
     • Манифест приложения
     • Цветной значок
     • Контурный значок

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

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

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

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

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

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

5. Нажмите Добавить.

   

6. Выберите Открыть.

   

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

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

   

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

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

    

Поздравляем! Вы сделали это! Вы научились создавать расширение сообщений на основе 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. Выберите Регистрация приложений.

   

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

   

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

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

6. Нажмите Зарегистрировать.

   

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

   

   Примечание.

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

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

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

dev tunnel

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

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

   

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

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

   

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

   

6. Нажмите Создать.

   

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

   

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

   

   Открывается всплывающее окно.

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

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

9. Нажмите OK.

   

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

10. Нажмите OK.

    

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

    

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

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

    

    Открывается всплывающее окно.

13. Нажмите Продолжить.

    

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

    

14. Перейдите в Visual Studio и выберите Просмотреть выходные > данные.

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

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

    

ngrok

Используйте ngrok или командную строку для создания туннеля к общедоступным конечным точкам HTTPS локального веб-сервера. Выполните следующую команду в ngrok:

ngrok http --host-header=localhost 3978

Совет

Если вы столкнулись с ERR_NGROK_4018, выполните действия, описанные в командной строке, чтобы зарегистрироваться и проверить подлинность ngrok. Затем выполните ngrok http --host-header=localhost 3978 команду .

В окне отображается URL-адрес HTTPS.

Добавление веб-проверки подлинности

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

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

   

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

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

5. Нажмите Настроить.

   

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

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

8. Выберите Сохранить.

   

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

Примечание.

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

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 идентификатора приложения нажмите кнопку Добавить.

   

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

   

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

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. Нажмите Создать.

   

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

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

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

   

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

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

   

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

    

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

    

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

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

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

    Примечание.

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

15. Выберите Проверить и создать.

    

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

    Подготовка бота занимает несколько минут.

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

    

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

    

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

1. В левой области выберите Каналы.

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

   

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

4. Выберите Принять.

   

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

   

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

Используйте один из следующих способов добавления конечной точки обмена сообщениями:

dev tunnel

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

   

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

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

   

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

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

   Примечание.

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

ngrok

1. Скопируйте URL-адрес HTTPS из ngrok.

   

   Примечание.

   URL-адрес HTTPS в ngrok — это полное доменное имя. — WebAppDomain это полное доменное имя, которое не включает https:// в него.

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

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

   

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

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

   Примечание.

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

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

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

   

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

   • Задайте "MicrosoftAppId" для бота идентификатор приложения Майкрософт.
   • Задайте "MicrosoftAppPassword"значение идентификатора секрета клиента бота.
   • Задайте ConnectionName имя подключения OAuth.
   • Задайте значение "MicrosoftAppType"MultiTenant.
   • Задайте значение "MicrosoftAppTenantId"common.

   

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

   

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

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

   

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

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

Visual Studio

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

2. Перейдите в раздел Файл>Открыть>проект/решение.....

   

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

   

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

5. Выберите Да, если появится следующий диалог:

   

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

   

Командная строка

Перейдите к примеру>msgext-action>csharp в окне командной строки и введите следующую команду:

    dotnet run

Добавление приложения расширения сообщений действия в Teams

1. В клонированных репозитория перейдите к примерам>msgext-action>csharp>TeamsAppManifest.

2. Создайте .zip со следующими файлами, которые находятся в папке Manifest :

   • manifest.json
   • icon-outline.png
   • icon-color.png

   

3. В клиенте Teams щелкните значок Приложения .

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

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

6. Найдите параметр Отправить пользовательское приложение. Если параметр отображается, включена отправка пользовательских приложений.

   

   Примечание.

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

7. Выберите Открыть , чтобы отправить файл messaging.zip, созданный в папку TeamsAppManifest.

   

8. Нажмите Добавить.

   

9. Выберите Открыть, чтобы открыть приложение в личных область.

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

   

Взаимодействие с приложением в Teams

1. Выберите Команду Создать карточку в списке команд для создания поля.

   

2. Введите свои данные во всплывающем окне модального окна.

   

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

   

4. Выберите Дополнительные параметры (...) в меню переполнения.

5. Выберите Дополнительные действия>Поделиться сообщением.

   

6. Если вы хотите включить изображение, установите флажок Включить изображение в карточке главного героя и нажмите кнопку Отправить.

   

Выполнение задачи

Ты придумала что-то вроде этого?

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

Команды действий

Учебники

Создание бота с проверкой подлинности единого входа

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

Руководство. Создание бота с проверкой подлинности единого входа

Бот ведет себя по-разному в зависимости от беседы, в которую он участвует:

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

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

Предварительные требования для создания бота

Убедитесь, что установлены следующие средства и настроена среда разработки:

Установка	Для использования...
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, ее можно получить бесплатно. Присоединяйтесь к программе для разработчиков Microsoft 365!

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

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

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

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

   

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

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

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

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

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

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

   

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

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

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

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

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

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

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

   

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

   

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

5. При необходимости выберите параметр клиента.

6. Нажмите Зарегистрировать.

   

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

   

   Примечание.

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

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

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

dev tunnel

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

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

   

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

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

   

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

   

6. Нажмите Создать.

   

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

   

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

   

   Открывается всплывающее окно.

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

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

9. Нажмите OK.

   

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

10. Нажмите OK.

    

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

    

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

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

    

    Открывается всплывающее окно.

13. Нажмите Продолжить.

    

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

    

14. Перейдите в Visual Studio и выберите Просмотреть выходные > данные.

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

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

    

ngrok

Используйте ngrok или командную строку для создания туннеля к общедоступным конечным точкам HTTPS локального веб-сервера. Выполните следующую команду в ngrok:

ngrok http --host-header=localhost 3978

Совет

Если вы столкнулись с ERR_NGROK_4018, выполните действия, описанные в командной строке, чтобы зарегистрироваться и проверить подлинность ngrok. Затем выполните ngrok http --host-header=localhost 3978 команду .

В окне отображается URL-адрес HTTPS.

Добавление веб-проверки подлинности

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

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

   

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

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

5. Нажмите Настроить.

   

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

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

8. Выберите Сохранить.

   

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

Примечание.

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

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 идентификатора приложения нажмите кнопку Добавить.

   

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

   

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

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. Задайте для requestedAccessTokenVersion2 параметра значение и нажмите кнопку Сохранить.

   

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

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

Примечание.

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

1. Перейдите на домашнюю страницу.

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

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

4. Выберите ВВОД.

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

6. Нажмите Создать.

   

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

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

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

   

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

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

   

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

    

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

    

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

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

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

    Примечание.

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

15. Выберите Проверить и создать.

    

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

    Подготовка бота занимает несколько минут.

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

    

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

    

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

1. В левой области выберите Каналы.

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

   

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

4. Выберите Принять.

   

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

   

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

Используйте один из следующих способов добавления конечной точки обмена сообщениями:

dev tunnel

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

   

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

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

   

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

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

   Примечание.

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

ngrok

1. Скопируйте URL-адрес HTTPS из ngrok.

   

   Примечание.

   URL-адрес HTTPS в ngrok — это полное доменное имя. — WebAppDomain это полное доменное имя, которое не включает https:// в него.

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

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

   

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

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

   Примечание.

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

Добавление параметров подключения OAuth

1. В левой области выберите Конфигурация.

2. Нажмите кнопку Добавить параметры подключения OAuth на экране Конфигурация.

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

   • Имя. Введите имя для нового параметра подключения. Имя можно использовать в параметрах кода службы бота.
   • Поставщик услуг. В раскрывающемся списке выберите Azure Active Directory версии 2.
   • Идентификатор клиента: обновите идентификатор приложения Майкрософт.
   • Секрет клиента: обновите значение секретов клиента.
   • URL-адрес обмена маркерами: обновите универсальный код ресурса (URI) идентификатора приложения.
   • Идентификатор клиента: введите Common.
   • Области: введите User.Read.

4. Выберите Сохранить.

   

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

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

   

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

   • Задайте "MicrosoftAppId" для бота идентификатор приложения Майкрософт.
   • Задайте "MicrosoftAppPassword"значение идентификатора секрета клиента бота.
   • Задайте ConnectionName имя подключения OAuth.
   • Задайте значение "MicrosoftAppType"MultiTenant.
   • Задайте значение "MicrosoftAppTenantId"common.

   

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

   

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

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

   

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

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

2. Перейдите в раздел Файл>Открыть>проект или решение....

   

3. В папке bot-conversation-sso-quickstart>csharp_dotnetcore папку и выберите BotConversationSsoQuickstart.sln файл.

   

4. Выберите F5 , чтобы запустить проект.

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

   

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

   Примечание.

   Эта страница отображается только при переходе по URL-адресу localhost.

   

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

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

   1. Перейдите в раздел Сервис>Диспетчер пакетов> NuGetПараметры диспетчера пакетов.
   2. В появившемся окне Параметры выберитеNuGet Package Manager Package Sources (Источники пакетов диспетчера>пакетов NuGet).
   3. Нажмите Добавить.
   4. В поле Имя введите nuget.org , а в поле Источник введите https://api.nuget.org/v3/index.json.
   5. Выберите Обновить и ОК.
   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. Найдите параметр Отправить пользовательское приложение.

   

4. Выберите Открыть , чтобы отправить файл .zip, созданный в папку Манифест .

   

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

   

6. Выберите Открыть.

   

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

7. Отправьте сообщение боту. Бот беседы впервые запрашивает согласие.

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

   

   Примечание.

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

9. Для мобильных устройств: выберите Принять.

   Примечание.

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

   

Ты придумала что-то вроде этого?

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

Включение единого входа для бота

Учебники

Создание первого приложения расширения для сообщений с помощью JavaScript

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

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

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

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

Это пошаговое руководство поможет вам создать приложение Teams для расширения сообщений с набором средств агентов в Visual Studio Code. После выполнения этого руководства вы увидите следующие выходные данные:

Предварительные условия

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

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

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

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

Установка microsoft 365 Agents Toolkit

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

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

Visual Studio Code

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

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

3. Нажмите кнопку Установить.

   

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

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

Командная строка

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

npm install -g @microsoft/m365agentstoolkit-cli

В зависимости от конфигурации может потребоваться использовать sudo для установки интерфейса командной строки:

sudo npm install -g --unsafe-perm @microsoft/m365agentstoolkit-cli

Это условие чаще встречается в системах Linux и macOS.

Убедитесь, что вы добавили глобальный кэш npm в PATH. Этот шаг обычно выполняется в рамках установщика Node.js.

С командой можно использовать cli atk . Убедитесь, что команда работает, выполнив командуatk -h .

Предостережение

Перед запуском TeamsFx в терминалах PowerShell необходимо включить политику удаленного подписанного выполнения для PowerShell.

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

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

Проверка параметра отправки приложения

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

Следующие действия помогут вам проверить, можно ли отправлять приложения в Teams.

1. В клиенте Teams щелкните значок Приложения .

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

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

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

   

   Примечание.

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

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

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

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

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

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

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

   

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

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

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

Создание рабочей области проекта для приложения расширения сообщений

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

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

Существует два типа расширений сообщений Teams:

• Команды поиска. Вы можете выполнять поиск во внешних системах и вставлять результаты в сообщение в виде карта.
• Команды действий. Вы можете предоставить пользователям модальное всплывающее окно для сбора или отображения информации. Затем вы можете обработать их взаимодействие и отправить информацию обратно в Teams.

Давайте создадим приложение расширения сообщений с помощью команды поиска. Сначала настройте новый проект Teams для создания приложения расширения сообщений.

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

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

Создание рабочей области проекта расширения сообщений

Если предварительные требования выполнены, давайте начнем!

Примечание.

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

Visual Studio Code

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

2. Щелкните значок Microsoft 365 Agents Toolkit на панели действий Visual Studio Code.

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

   

4. Выберите Расширение сообщений.

   

5. Выберите Настраиваемые результаты поиска.

   

6. Выберите Начать с бота.

   

7. Выберите JavaScript.

   

8. Выберите Папка по умолчанию , чтобы сохранить корневую папку проекта в расположении по умолчанию.

   

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

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

      

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

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

      

9. Введите подходящее имя для приложения. Выберите ВВОД.

   

   Agent Toolkit создаст приложение за несколько секунд.

   

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

   

Командная строка

Используйте интерфейс командной строки atk для создания первого проекта.

1. Перейдите в папку, в которой вы хотите создать папку проекта, и откройте командную строку.

2. Чтобы создать приложение Teams, введите следующую команду:

   atk new
   

3. CLI предоставляет ряд вариантов на выбор. Используйте клавиши со стрелками, чтобы выбрать параметр. Выбрав нужный вариант, нажмите клавишу ВВОД, чтобы подтвердить.

   1. Выберите Расширение сообщений для нового проекта.
   2. Выберите Настраиваемые результаты поиска для функции приложения с помощью расширения сообщений.
   3. Выберите Начать с бота для архитектуры расширения сообщений на основе поиска.
   4. Выберите JavaScript для языка программирования.
   5. Нажмите клавишу ВВОД , чтобы выбрать папку рабочей области по умолчанию для приложения.
   6. Введите подходящее имя для приложения. Имя приложения должно состоять только из букв и цифр.

CLI создает проект после ответов на все вопросы.

Обзор исходного кода приложения расширения сообщений

Расширение сообщений использует Bot Framework для взаимодействия со службой через беседу. После формирования шаблонов просмотрите каталоги и файлы проекта в разделе EXPLORER.

Папка и файл	Содержание
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.

Visual Studio Code

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

2. Щелкните значок Microsoft 365 Agents Toolkit на панели действий.

3. Выберите Войти в Microsoft 365 с помощью учетных данных. Откроется веб-браузер по умолчанию, чтобы разрешить вход.

   

4. Закройте браузер после входа с помощью учетных данных.

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

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

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

Командная строка

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

2. Войдите в Microsoft 365 с помощью microsoft 365 Agents Toolkit CLI (ранее известного как TeamsFx CLI):

   atk account login m365
   

Откроется веб-браузер по умолчанию, чтобы разрешить вход. Войдите в учетную запись Azure, используя свои учетные данные. Закройте браузер при появлении запроса.

Создание и запуск приложения в локальной среде

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

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

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

   Примечание.

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

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

   При выборе 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.

Тестирование приложения

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

Выполнение поискового запроса

Расширение сообщений

1. Введите имя пакета npm с открытым кодом в поле поиска расширения сообщения, например cli. Расширение сообщения отображает список соответствующих элементов.

   

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

   

3. Выберите ВВОД. Приложение расширения сообщений отправляет адаптивную карточку с элементом в чате или канале.

   

Поле командной строки

1. Введите / имя приложения расширения сообщений в командном поле.

   

   В командном окне откроется приложение расширения сообщений.

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

   

   Расширение сообщений отображает результаты поиска в виде адаптивной карточки в командном окне.

   

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

   

4. Выберите ВВОД. Приложение расширения сообщений отправляет адаптивную карточку с результатом поиска в последнем чате.

   

Открытие приложения расширения сообщений

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

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

1. Введите / имя приложения расширения сообщений в командном поле.

   

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

   Примечание.

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

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

1. Выберите три точки в нижней части области создания сообщения.

2. Выберите приложение расширения сообщений.

   

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

Открытие приложения из отправленных пользовательских приложений

1. Выберите Приложения>Управление приложениями.

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

   

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

   

4. Список приложений расширения сообщений появится в последней версии чата Teams. Выберите приложение расширения сообщений в списке.

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

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

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

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

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

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

Visual Studio Code

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

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

3. Щелкните значок Microsoft 365 Agents Toolkit на панели действий.

4. Выберите Войти, чтобы Azure с помощью учетных данных. Откроется веб-браузер по умолчанию, чтобы разрешить вход.

   Совет

   Если у вас установлено расширение учетной записи AZURE и вы используете ту же учетную запись, этот шаг можно пропустить.

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

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

Командная строка

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

2. Войдите в Azure с помощью команды CLI набора средств агентов:

   atk account login azure
   

3. Откроется веб-браузер по умолчанию, чтобы разрешить вход. Войдите в учетную запись Azure, используя свои учетные данные. Закройте браузер при появлении запроса.

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

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

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

В чем разница между подготовкой и развертыванием?

Шаг подготовки создает ресурсы в Azure и Microsoft 365 для приложения, но код (например, HTML, CSS или JavaScript) не копируется в ресурсы. Шаг Развертывание копирует код приложения в ресурсы, созданные на этапе подготовки. Обычно развертывание выполняется несколько раз без подготовки новых ресурсов. Так как этап подготовки занимает некоторое время, он отделен от шага развертывания.

Visual Studio Code

Щелкните значок Microsoft 365 Agents Toolkit на панели действий Visual Studio Code.

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

   

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

   

3. Выберите группу ресурсов.

   

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

   1. Выберите + Создать группу ресурсов.

      

   2. Выберите имя по умолчанию или введите подходящее имя для группы ресурсов.

      

   3. Выберите расположение для группы ресурсов.

      

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

   

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

   

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

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

   

5. В разделе ЖИЗНЕННЫЙ цикл выберите Развернуть.

   

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

   

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

Командная строка

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

2. Запустите atk provision.

   atk provision
   

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

3. Запустите atk deploy.

   atk deploy
   

   Развернуто приложение расширения сообщений.

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

После завершения действий по подготовке и развертыванию перейдите к разделу Запуск и отладка (CTRL+SHIFT+D или Просмотр > запуска) в наборе средств агентов.

1. Выберите раскрывающееся меню ЗАПУСК И ОТЛАДКА .

2. Выберите Запустить удаленное приложение в Teams (Edge).

3. Нажмите кнопку ▷ .

   

4. Откроется диалоговое окно для установки развернутого приложения в Teams. Нажмите Добавить.

   

   Teams открывает приложение расширения сообщений в последнем чате.

   

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

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

• Серверная часть работает с использованием Azure Functions Core Tools.
• Конечная точка HTTP приложения, в которую Microsoft Teams загружает приложение, работает локально.

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

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

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

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

Ты придумала что-то вроде этого?

Создание приложения расширения сообщений

Учебники

Создание первого приложения вкладки с помощью C sharp

Начните разработку приложений Microsoft Teams, создав свое первое приложение Teams с возможностью вкладки.

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

• Настройка нового проекта.
• Создание приложений с возможностью вкладки с помощью C# и Microsoft Visual Studio 2022.

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

Это пошаговое руководство поможет вам создать вкладку с помощью microsoft 365 Agents Toolkit (ранее известного как Набор средств Teams). После выполнения этого руководства вы увидите следующие выходные данные:

Предварительные требования для создания приложения

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

Установка	Для использования...
Microsoft Teams	Microsoft Teams позволяет взаимодействовать со всеми пользователями, с которыми вы работаете, с помощью приложений для чата, собраний и звонков в одном месте.
Visual Studio 2022	Вы можете установить корпоративную версию в Visual Studio 2022, а также рабочие нагрузки ASP.NET и веб-разработки. Используйте последнюю версию.
Microsoft 365 Agents Toolkit	Расширение Visual Studio, создающее шаблон проекта для приложения. Используйте последнюю версию.

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

Agent Toolkit помогает упростить процесс разработки с помощью средств для создания шаблонов проекта для приложения. Она создает необходимую структуру каталогов для всех выбранных возможностей с необходимыми файлами, готовыми к сборке проекта.

Вы можете скачать последнюю версию установщика Visual Studio. Набор средств агентов доступен как расширение в Visual Studio.

После открытия установщика Visual Studio во всплывающем окне рабочих нагрузок:

1. Выберите ASP.NET и веб-разработка.

2. В разделе Сведения об> установкеНеобязательно выберите Средства разработки Microsoft Teams.

3. Нажмите кнопку Установить.

   

4. Нажмите кнопку Запустить. Откроется окно приложения Visual Studio 2022.

   

5. Перейдите > в разделРасширения Управление расширениями.

   

   Откроется окно Управление расширением:

   

6. В левой области выберите Установленные. Доступно расширение Microsoft 365 Agents Toolkit .

   

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

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

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

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

Примечание.

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

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

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

1. Откройте Microsoft Teams, щелкните значок Приложения .

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

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

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

   

Примечание.

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

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

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

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

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

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

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

   

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

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

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

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

Создание рабочей области проекта для приложения вкладки с помощью C sharp

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

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

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

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

   

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

4. Выберите Агенты> Microsoft 365Далее.

   

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

6. Введите требуемое имя проекта в поле Имя проекта.

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

8. Нажмите Создать.

   

9. Выберите TabCreate (Создатьвкладку>).

   

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

Создание и запуск первого приложения вкладки с помощью C sharp

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

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

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

1. В Обозреватель решений в разделе Решение MyTeamsApp щелкните правой кнопкой мыши MyTeamsApp.

2. Выберите Microsoft 365 Agents Toolkit(Выбор учетной записи Microsoft 365).>

   

3. Выберите Microsoft 365 Account Continue (Продолжить учетную запись> Microsoft 365).

   

Локальная сборка и запуск приложения в Visual Studio

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

1. Выберите Отладка>Начать отладку или нажмите клавишу F5.

   

   Visual Studio запускает процесс отладки и открывает веб-клиент Teams в браузере. При появлении запроса войдите в свою учетную запись Microsoft 365.

2. Нажмите Добавить.

   

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

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

Поздравляем, ваше первое приложение вкладки запущено в Teams!

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

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

Вы успешно создали приложение-вкладку с помощью C#. Agents Toolkit добавил необходимый шаблон в структуру каталогов приложения. Это руководство завершено.

Создание вкладки

Создание проекта Teams с помощью microsoft 365 Agents Toolkit

Учебники

Добавление единого входа в приложение расширения вкладок и сообщений

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. Выберите Регистрация приложений.

   

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

   

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

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

6. Нажмите Зарегистрировать.

   

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

   

   Примечание.

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

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

Выберите один из следующих способов создания туннеля:

dev tunnel

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

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

   

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

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

   

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

   

6. Нажмите Создать.

   

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

   

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

   

   Открывается всплывающее окно.

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

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

9. Нажмите OK.

   

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

10. Нажмите OK.

    

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

    

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

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

    

    Открывается всплывающее окно.

13. Нажмите Продолжить.

    

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

    

14. Перейдите в Visual Studio и выберите Просмотреть > выходные данные.

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

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

    

ngrok

Используйте ngrok или командную строку для создания туннеля к общедоступным конечным точкам HTTPS локального веб-сервера. Выполните следующую команду в ngrok:

ngrok http --host-header=localhost xxxx

Совет

Если вы столкнулись с ERR_NGROK_4018, выполните действия, описанные в командной строке, чтобы зарегистрироваться и проверить подлинность ngrok. Затем выполните ngrok http --host-header=localhost xxxx команду .

В окне отображается URL-адрес HTTPS.

Добавление веб-проверки подлинности

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

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

   

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

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

5. Нажмите Настроить.

   

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

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

8. Выберите Сохранить.

   

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

Примечание.

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

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 идентификатора приложения нажмите кнопку Добавить.

   

3. Обновите URI идентификатораapi://your-devtunnel-domain/botid-{AppID} приложения в формате или api://your-ngrok-domain/botid-{AppID} и нажмите кнопку Сохранить.

   

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

   

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

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. Задайте для requestedAccessTokenVersion2 параметра значение и нажмите кнопку Сохранить.

   

Создать бота

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

Примечание.

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

1. Перейдите на домашнюю страницу.

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

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

4. Выберите ВВОД.

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

6. Нажмите Создать.

   

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

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

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

   

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

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

   

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

    

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

    

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

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

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

    Примечание.

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

15. Выберите Проверить и создать.

    

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

    Подготовка бота занимает несколько минут.

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

    

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

    

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

1. В левой области выберите Каналы.

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

   

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

4. Выберите Принять.

   

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

   

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

dev tunnel

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

   

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

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

   

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

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

   Примечание.

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

ngrok

1. Скопируйте URL-адрес HTTPS из ngrok.

   

   Примечание.

   URL-адрес HTTPS в ngrok — это полное доменное имя. — WebAppDomain это полное доменное имя, которое не включает https:// в него.

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

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

   

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

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

   Примечание.

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

Добавление параметров подключения OAuth

1. В левой области выберите Конфигурация.

2. Нажмите кнопку Добавить параметры подключения OAuth на экране Конфигурация.

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

   • Имя. Введите имя для нового параметра подключения. Имя можно использовать в параметрах кода службы бота.
   • Поставщик услуг. В раскрывающемся списке выберите Azure Active Directory версии 2.
   • Идентификатор клиента: обновите идентификатор приложения Майкрософт.
   • Секрет клиента: обновите значение секретов клиента.
   • URL-адрес обмена маркерами: обновите универсальный код ресурса (URI) идентификатора приложения.
   • Идентификатор клиента: введите Common.
   • Области: введите User.Read.

4. Выберите Сохранить.

   

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

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

   

2. Откройте файл appsettings.json в Visual Studio.

3. Обновите следующие сведения:

   • Замените "MicrosoftAppId"на идентификатор приложения Майкрософт бота.
   • Замените "MicrosoftAppPassword"значение секретов клиента бота.
   • Замените "SiteUrl" на URL-адрес ngrok.
   • Замените "ConnectionName" на имя параметра подключения OAuth.
   • Замените "TenantId" идентификатором клиента, в котором используется приложение.
   • Замените "ClientId"на идентификатор приложения Майкрософт бота.
   • Замените "AppSecret"значение секретов клиента бота.
   • Замените "ApplicationIdURI" в виде api://*******.ngrok.io/botid-{AppID}.

   

Настройка файла манифеста

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

   

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

   • Замените DOMAIN-NAME URL-адресом ngrok.

   • Замените YOUR-MICROSOFT-APP-IDидентификатором приложения Microsoft бота.

     Примечание.

     В зависимости от сценария [YOUR-MICROSOFT-APP-ID] и [DOMAIN-NAME] может происходить несколько раз.

   • Замените resource на api://*******.ngrok.io/botid-{AppID}.
     

     

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

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

Visual Studio

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

2. Выберите Файл>Открыть> *Проект/Решение...

   

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

   

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

5. Выберите Да, если появится следующий диалог:

   

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

Командная строка

Перейдите в папку csharp в окне командной строки и введите следующую команду:

dotnet run

Отправка приложения единого входа в Teams

1. В клонированного репозитория перейдите к csharp>App SSO Sample>TeamsAppManifest.

2. Создайте файл .zip со следующими файлами, которые находятся в папке Manifest :

   • manifest.json
   • icon-outline.png
   • icon-color.png

   

3. В клиенте Teams щелкните значок Приложения .

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

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

6. Найдите параметр Отправить пользовательское приложение. Если параметр отображается, включена отправка пользовательских приложений.

   

   Примечание.

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

7. Нажмите кнопку Открыть , чтобы отправить файл .zip, созданный в папку Манифест .

   

8. Нажмите Добавить.

   

9. Выберите Открыть и отправьте сообщение боту.

   

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

    

11. Выберите Да , чтобы просмотреть маркер, или Нет , чтобы продолжить работу с чатом.

    

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

    

13. Чтобы войти в систему, если единый вход не выполняется, выполните приведенные ниже действия.

    1. В левой области Teams выберите Дополнительные добавленные приложения (●●●).

    2. Выберите новое приложение единого входа.

       

    3. Выберите Войти.

       

    4. Введите учетные данные в окне входа и нажмите кнопку Далее.

       

    5. Выберите Принять.

       

    6. Выберите свой профиль в поле поиска. Вы увидите следующие выходные данные:

       

14. Отправьте https://profile.botframework.com приложению, чтобы получить карта профиля.

    

Вы придумали такие выходные данные?

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

Включение единого входа для приложения вкладки

Включение единого входа для приложения

Учебники