Отладка приложения Teams

Статья
10/28/2024

Набор средств Microsoft Teams помогает выполнять отладку и предварительный просмотр приложения Microsoft Teams. Отладка — это процесс проверки, обнаружения и исправления проблем или ошибок, чтобы убедиться, что программа успешно работает в Teams.

Отладка приложения Teams для Visual Studio Code

Набор средств Teams в Microsoft Visual Studio Code автоматизирует процесс отладки. Вы можете обнаруживать ошибки и исправлять их, а также просматривать приложение Teams. Вы также можете настроить параметры отладки для создания вкладки или бота.

В процессе отладки:

Набор средств Teams автоматически запускает службы приложений, запускает отладчики и отправляет приложение Teams.
Набор средств Teams проверяет предварительные требования во время фонового процесса отладки.
Приложение Teams доступно для предварительной версии в веб-клиенте Teams локально после отладки.
Можно также настраивать параметры отладки для загрузки настроенного приложения, используя конечные точки бота, сертификат разработки или частичную отладку компонента.
Visual Studio Code позволяет отладить вкладку, бот, расширение для сообщений и Функции Azure.

Основные функции отладки набора средств Teams

Набор средств Teams поддерживает следующие функции отладки:

Начать отладку
Многоцелевая отладка
Точки останова
Горячая перезагрузка
Остановить отладку
Средство тестирования приложений Teams
Отладка приложений в классическом клиенте Teams

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

Начало отладки

Вы можете нажать клавишу F5 в качестве одной операции, чтобы начать отладку. Набор средств Teams начинает проверка предварительных требований, регистрирует Microsoft Entra приложение, приложение Teams, а также регистрирует бота, запускает службы и запускает браузер.

Многоцелевая отладка

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

Переключать точки останова

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

Горячая перезагрузка

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

Остановить отладку

После завершения локальной отладки можно выбрать Остановить (SHIFT+F5) или [ALT] Отключить (SHIFT+F5) на плавающей панели инструментов отладки, чтобы остановить все сеансы отладки и завершить задачи. На следующем рисунке показано действие "Остановить отладку":

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

Средство тестирования приложений Teams

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

Отладка приложений в классическом клиенте Teams

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

Подготовка к отладке

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

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

Переключать точки останова

Убедитесь, что вы можете переключать точки останова в исходных кодах вкладок, ботов, расширений сообщений и Функции Azure. Дополнительные сведения см. в разделе Переключение точек останова.

Настроить параметры отладки

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

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

Узнайте, как использовать существующего бота для отладки

Teams Toolkit создает Microsoft Entra приложения для проектов с ботом по умолчанию с помощью botAadApp/create действия.

Чтобы использовать существующего бота, можно задать BOT_ID и SECRET_BOT_PASSWORD в env/.env.local с собственными значениями.

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

# env/.env.local

# Built-in environment variables
TEAMSFX_ENV=local

# Generated during provision, you can also add your own variables.
BOT_ID={YOUR_OWN_BOT_ID}
...

SECRET_BOT_PASSWORD={YOUR_OWN_BOT_PASSWORD}
...

Настройка сценариев

Ниже приведен список сценариев отладки, которые можно использовать:

Пропустить проверки готовности

В .vscode/tasks.json разделе "Validate prerequisites">>"args""prerequisites"обновите проверки готовности, которые нужно пропустить.

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

Использование сертификата разработки

В teamsapp.local.ymlудалите devCert из devTool/install действия (или удалите все devTool/install действие, если оно содержит devCertтолько ).

В teamsapp.local.ymlзадайте "SSL_CRT_FILE" и "SSL_KEY_FILE" в file/createOrUpdateEnvironmentFile действии путь к файлу сертификата и путь к файлу ключа.

# teamsapp.local.yml
...
  # Remove devCert or this whole action
  - uses: devTool/install
    with:
      # devCert:
  ...
  - uses: file/createOrUpdateEnvironmentFile
    with:
      target: ./.localSettings
      envs:
        ...
        # set your own cert values
        SSL_CRT_FILE: ...
        SSL_KEY_FILE: ...
...

Настройка команды установки npm

В teamsapp.local.ymlизмените argscli/runNpmCommand действие.

# teamsapp.local.yml
...
  - uses: cli/runNpmCommand
    with:
      # edit the npm command args
      args: install --no-audit
...

Изменение портов

Bot
1. Выполните поиск "3978" по всему проекту и найдите внешние представления в tasks.json и index.js.
2. Замените его своим портом.
Tab
1. Выполните поиск "53000" по всему проекту и найдите внешние представления в teamsapp.local.yml и tasks.json.
2. Замените его своим портом.

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

Набор средств Teams по умолчанию создает набор teamsApp действий для управления пакетом приложения. Вы можете обновить их, teamsapp.local.yml чтобы использовать собственный пакет приложения.

# teamsapp.local.yml
...
  - uses: teamsApp/create # Creates a Teams app
    ...
  - uses: teamsApp/validateManifest # Validate using manifest schema
    ...
  - uses: teamsApp/zipAppPackage # Build Teams app package with latest env value
    ...
  - uses: teamsApp/validateAppPackage # Validate app package using validation rules
    ...
  - uses: teamsApp/update # Apply the app manifest (previously called Teams app manifest) to an existing Teams app in Teams Developer Portal.
    ...
...

Использование собственного туннеля

В .vscode/tasks.json разделе "Start Teams App Locally"можно обновить "Start Local tunnel".

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

# env/.env.local

# Built-in environment variables
TEAMSFX_ENV=local
...
BOT_DOMAIN={YOUR_OWN_TUNNEL_DOMAIN}
BOT_ENDPOINT={YOUR_OWN_TUNNEL_URL}
...

# env/.env.local

# Built-in environment variables
TEAMSFX_ENV=local
...
BOT_DOMAIN={YOUR_OWN_TUNNEL_DOMAIN}
BOT_ENDPOINT={YOUR_OWN_TUNNEL_URL}
...

Добавление переменных среды

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

Примечание.

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

Частичная отладка компонента

Набор средств Teams использует многоцелевую отладку Visual Studio Code для одновременной отладки вкладки, бота, расширения для сообщений и Функций Azure. Можно обновить .vscode/launch.json и .vscode/tasks.json для отладки частичного компонента. Если вы хотите отладить только вкладку в проекте, содержащем вкладку и бот с Azure Functions, используйте следующие действия:

Обновление "Attach to Bot" и "Attach to Backend" из отладочного соединения в .vscode/launch.json.

{
    "name": "Debug in Teams (Edge)",
     "configurations": [
        "Attach to Frontend (Edge)",
        // "Attach to Bot",
        // "Attach to Backend"
        ],
        "preLaunchTask": "Start Teams App Locally",
        "presentation": {
            "group": "all",
            "order": 1
        },
        "stopAll": true

}

Обновите "Start Backend" задачу "Запустить все" и "Start Bot" "Запустить все" в vscode/tasks.json.

{

    "label": "Start application",
    "dependsOn": [
        "Start Frontend",
          // "Start Backend",
          // "Start Bot"

      ]

}

Локальная отладка приложений

Поделиться через

Отладка приложения Teams