Débogage à distance HoloLens 2 applications WebView2 WinUI 2 (UWP)

Pour utiliser Microsoft Edge DevTools pour déboguer une application WebView2 WinUI 2 (UWP), utilisez le débogage à distance. Le débogage à distance est nécessaire pour les applications WebView2 WinUI 2 (UWP), car actuellement, les devTools intégrés ne peuvent pas être lancés dans une application WebView2 WinUI 2 (UWP) signée par le Store.

WebView2 sur HoloLens 2 et le plug-in WebView pour Unity sont tous deux en préversion et sont susceptibles d’être modifiés avant la disponibilité générale.

WebView2 et le plug-in WebView2 ne sont pris en charge que sur HoloLens 2 appareils exécutant la mise à jour Windows 11. Pour plus d’informations, consultez Mettre à jour HoloLens 2.

Attacher DevTools à distance à une application WebView2 WinUI 2 (UWP) HoloLens 2

Attachez Microsoft Edge DevTools à distance à une application HoloLens 2 WebView2 WinUI 2 (UWP) comme suit :

1. Dans Microsoft Edge, accédez à edge://inspect. La page Inspecter avec les outils de développement Edge s’ouvre :

   

2. Activer Device Portal : ouvrez paramètres Windows, sélectionnez Mettre à jour & sécurité>pour les développeurs, puis activez le bouton bascule Portail d’appareil :

   

   Dans Se connecter à l’aide d’Ethernet>, notez l’URL qui sera utilisée pour la connexion de débogage à distance.

3. Installez les Outils de gestion à distance pour Microsoft Edge à partir du Microsoft Store sur votre appareil HoloLens 2.

4. Dans Microsoft Edge, accédez à l’URL du portail d’appareil que vous avez notée précédemment. Vérifiez que la page Confirmer les paramètres de sécurité est chargée (sous l’onglet Portail d’appareil Windows ) :

   

5. Si vous déboguez uniquement des applications qui s’exécutent localement, vous pouvez sélectionner le bouton Continuer avec une connexion non sécurisée .

   Ou, si vous n’exécutez pas l’application localement ou si vous devez vous connecter via HTTPS, sélectionnez le lien Configurer une connexion sécurisée , puis suivez les étapes de la page vers laquelle vous êtes redirigé.

6. Vérifiez que vous êtes redirigé vers la page Gestionnaire d’applications : Portail d’appareil Windows :

   

7. Accédez à et vérifiez que les outils à http://<Device Portal URL>/msedge distance pour Microsoft Edge fonctionnent. La page charge une liste vide : [], sauf si une application en cours d’exécution peut être déboguée par les outils à distance.

8. Configurez votre application WebView2 WinUI 2 (UWP) pour le débogage à distance :

   Pour activer le débogage à distance, une variable d’environnement doit être définie dans votre projet. Cette variable doit être définie avant de créer le CoreWebView2 instance et avant de définir la WebView2.Source propriété ou d’appeler la WebView2.EnsureCoreWebView2Async méthode .

   Définissez la variable suivante :

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

   Par exemple, si vous utilisez l’application WebView2 Sample UWP, vous pouvez définir la variable d’environnement en ajoutant la ligne suivante dans le Browser.xaml.cs fichier :

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

   La ligne est numérotée 33 dans cette capture d’écran, dans le Browser() constructeur, sous un #endif qui encapsule une instruction existante SetEnvironmentVariable :

   

9. Lancez votre application sur votre appareil HoloLens 2.

10. Accédez à http://<Device Portal URL>/msedge, par http://localhost:50080/msedgeexemple , et assurez-vous que votre instance WebView2 s’affiche dans la liste :

    

11. Accédez à edge://inspect. Dans la zone de texte Se connecter à un appareil Windows distant , entrez http://<Device Portal URL>, par http://localhost:50080exemple , puis cliquez sur Se connecter à l’appareil.

12. Vérifiez que vous pouvez vous connecter correctement, afin que votre contrôle WebView2 débogué, nommé Edge, soit répertorié sous le nom de votre ordinateur :

    

13. En bas de l’entrée de contrôle Edge WebView2, cliquez sur le lien Inspecter . Microsoft Edge DevTools s’ouvre pour le contrôle WebView2 :

    

Vous pouvez maintenant utiliser Microsoft Edge DevTools pour inspecter et déboguer le contrôle WebView2 dans votre application HoloLens 2 WebView2 WinUI 2 (UWP).

Voir aussi

• Débogage à distance des applications WebView2 WinUI 2 (UWP)