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


Удаленная отладка приложений Xbox WebView2 WinUI 2 (UWP)

Чтобы использовать средства разработки Microsoft Edge для отладки приложения WebView2 WinUI 2 (UWP), используйте удаленную отладку. Удаленная отладка необходима для приложений WebView2 WinUI 2 (UWP), так как в настоящее время встроенные средства разработки не могут быть запущены в приложении WebView2 WinUI 2 (UWP) с подписью магазина.

Удаленное подключение devTools к приложению Xbox WebView2 WinUI 2 (UWP)

Удаленно подключите Средства разработки Microsoft Edge к приложению Xbox WebView2 WinUI 2 (UWP) следующим образом:

  1. В Microsoft Edge перейдите по адресу edge://inspect. Откроется страница Проверка с помощью средств разработчика Edge :

    Страница служебной программы DevTools Inspect

  2. Включите режим разработчика на Xbox. См. раздел Активация режима разработчика Xbox One.

  3. В Microsoft Edge перейдите по адресу https://<System IP>:11443, где <System IP> заменяется IP-адресом системной ОС Xbox. На вкладке Портал устройств Windows отобразится страница Подтверждение параметров безопасности:

    Страница

  4. Нажмите кнопку Продолжить с незащищенным подключением . Появится ошибка SSL-сертификата NET::ERR__CERT_AUTHORITY_INVALID:

    Ошибка SSL

  5. Нажмите кнопку Дополнительно. Появится сообщение "Сервер не смог доказать...":

    Дополнительный параметр

  6. Щелкните ссылку Continue to<System IP>(unsafe), где <System IP> заменяется IP-адресом ОС Системы Xbox. Откроется портал устройств Xbox:

    Портал устройств Xbox

  7. Перейдите в https://<System IP>:11443/config/rootcertificate, где <System IP> заменяется IP-адресом ОС системы Xbox. При этом скачивается rootcertificate.cer файл:

    Файл корневого сертификата, указанный в диалоговом окне загрузки Microsoft Edge

  8. Откройте скачанный rootcertificate.cer файл. Откроется диалоговое окно предупреждения системы безопасности:

    Диалоговое окно

  9. Нажмите кнопку Открыть . Откроется диалоговое окно Сертификат :

    Диалоговое окно

  10. Нажмите кнопку Установить сертификат . Откроется диалоговое окно "Добро пожаловать в мастер импорта сертификатов":

    Диалоговое окно

  11. Нажмите кнопку Текущий пользователь и нажмите кнопку Далее . Откроется мастер импорта сертификатов:

    Мастер импорта сертификатов

  12. Выберите параметр Поместить все сертификаты в следующее хранилище, нажмите кнопку Обзор и выберите Доверенные корневые центры сертификации.

  13. Нажмите кнопку Далее . Откроется диалоговое окно "Предупреждение системы безопасности ":

    Диалоговое окно

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

  15. Перезапустите Microsoft Edge.

  16. Перейдите в https://<System IP>:11443, где <System IP> заменяется IP-адресом ОС Системы Xbox, и убедитесь, что подключение указано как безопасное (то есть URL-адрес HTTPS):

    Безопасный XDP

  17. В проекте приложения задайте следующую переменную, чтобы настроить приложение WebView2 WinUI 2 (UWP) для удаленной отладки.

    Чтобы включить удаленную отладку, в проекте должна быть задана переменная среды. Эту переменную необходимо задать перед созданием экземпляра CoreWebView2 , а также перед заданием WebView2.Source свойства или вызовом WebView2.EnsureCoreWebView2Async метода .

    "WEBVIEW2_ADDITIONAL_BROWSER_ARGUMENTS", "--enable-features=msEdgeDevToolsWdpRemoteDebugging"
    

    Например, если вы используете пример приложения UWP WebView2, можно задать переменную среды, добавив следующую строку в Browser.xaml.cs файл:

    Environment.SetEnvironmentVariable("WEBVIEW2_ADDITIONAL_BROWSER_ARGUMENTS", "--enable-features=msEdgeDevToolsWdpRemoteDebugging");
    

    Строка нумеруется 33 на этом снимке экрана в конструкторе Browser() под элементом #endif , который заключает в оболочку существующую SetEnvironmentVariable инструкцию:

    Удаленная отладка аргументов браузера

  18. Разверните приложение на xbox с помощью Xbox Device Portal и запустите приложение.

  19. Перейдите по адресу edge://inspect.

  20. В текстовом поле Подключиться к удаленному устройству Windows введите https://<System IP>:11443, где <System IP> заменяется IP-адресом ОС системы Xbox, а затем нажмите кнопку Подключиться к устройству .

  21. Убедитесь, что вы успешно можете подключиться, чтобы отлаживаемый элемент управления WebView2 с именем Edge был указан под именем компьютера:

    Проверка Edge Xbox

  22. В нижней части элемента управления Edge WebView2 щелкните ссылку проверка . Microsoft Edge DevTools откроется для элемента управления WebView2:

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

Теперь вы можете использовать Средства разработки Microsoft Edge для проверки и отладки элемента управления WebView2 в приложении Xbox WebView2 WinUI 2 (UWP).

См. также