Remotedebuggen HoloLens 2 WebView2 WinUI 2-Apps (UWP)

Um Microsoft Edge DevTools zum Debuggen einer WebView2 WinUI 2(UWP)-App zu verwenden, verwenden Sie Remotedebuggen. Remotedebuggen ist für WebView2 WinUI 2(UWP)-Apps erforderlich, da die integrierten DevTools derzeit nicht in einer store-signierten WebView2 WinUI 2 (UWP)-App gestartet werden können.

WebView2 auf HoloLens 2 und das WebView-Plug-In für Unity befinden sich beide in der Vorschau und können vor der allgemeinen Verfügbarkeit geändert werden.

WebView2 und das WebView2-Plug-In werden nur auf HoloLens 2 Geräten unterstützt, auf denen das Windows 11-Update ausgeführt wird. Weitere Informationen finden Sie unter Update HoloLens 2.

Remoteanfügen von DevTools an eine HoloLens 2 WebView2 WinUI 2-App (UWP)

Fügen Sie Microsoft Edge DevTools wie folgt remote an eine HoloLens 2 WebView2 WinUI 2(UWP)-App an:

1. Navigieren Sie in Microsoft Edge zu edge://inspect. Die Seite Mit Edge-Entwicklertools untersuchen wird geöffnet:

   

2. Geräteportal aktivieren: Öffnen Sie Windows-Einstellungen, wählen Sie Update & Sicherheit>für Entwickler aus, und aktivieren Sie dann die Umschaltfläche Geräteportal :

   

   Notieren Sie sich unter Herstellen einer Verbindung mit>Ethernet die URL, die für die Remotedebugverbindung verwendet wird.

3. Installieren Sie Remotetools für Microsoft Edge aus dem Microsoft Store auf Ihrem HoloLens 2 Gerät.

4. Navigieren Sie in Microsoft Edge zu der zuvor notierten Geräteportal-URL. Vergewissern Sie sich, dass die Seite Sicherheitseinstellungen bestätigen geladen ist (auf der Registerkarte Windows-Geräteportal ):

   

5. Wenn Sie nur Apps debuggen, die lokal ausgeführt werden, können Sie die Schaltfläche Mit einer ungesicherten Verbindung fortfahren auswählen.

   Wenn Sie die App nicht lokal ausführen oder eine Verbindung über HTTPS herstellen müssen, wählen Sie den Link Sichere Verbindung konfigurieren aus, und führen Sie dann die Schritte auf der Seite aus, zu der Sie weitergeleitet werden.

6. Vergewissern Sie sich, dass Sie zur Seite Apps-Manager: Windows-Geräteportal umgeleitet werden:

   

7. Wechseln Sie zu , http://<Device Portal URL>/msedge und überprüfen Sie, ob Remotetools für Microsoft Edge funktionieren. Die Seite lädt eine leere Liste: [], es sei denn, es wird eine Anwendung ausgeführt, die von Remotetools debuggt werden kann.

8. Konfigurieren Sie Ihre WebView2 WinUI 2 (UWP)-App für das Remotedebuggen:

   Um das Remotedebuggen zu aktivieren, muss eine Umgebungsvariable in Ihrem Projekt festgelegt werden. Diese Variable muss vor dem Erstellen des CoreWebView2 instance und vor dem Festlegen der WebView2.Source -Eigenschaft oder dem Aufrufen der WebView2.EnsureCoreWebView2Async -Methode festgelegt werden.

   Legen Sie die folgende Variable fest:

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

   Wenn Sie beispielsweise die WebView2-Beispiel-UWP-App verwenden, können Sie die Umgebungsvariable festlegen, indem Sie die folgende Zeile in der Browser.xaml.cs Datei hinzufügen:

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

   Die Zeile ist in diesem Screenshot im Konstruktor unter einem #endif 33 nummeriert, der Browser() eine vorhandene SetEnvironmentVariable Anweisung umschließt:

   

9. Starten Sie Ihre App auf Ihrem HoloLens 2 Gerät.

10. Wechseln Sie zu , zhttp://localhost:50080/msedge. B. http://<Device Portal URL>/msedge, und stellen Sie sicher, dass Ihre WebView2-instance in der Liste angezeigt wird:

    

11. Gehen Sie zu edge://inspect. Geben Sie im Textfeld Verbindung mit einem Windows-Remotegerät herstellen ein http://<Device Portal URL>, z http://localhost:50080. B. , und klicken Sie dann auf Mit Gerät verbinden.

12. Stellen Sie sicher, dass Sie erfolgreich eine Verbindung herstellen können, sodass Ihr debugfähiges WebView2-Steuerelement namens Edge unter ihrem Computernamen aufgeführt ist:

    

13. Klicken Sie am unteren Rand des Edge WebView2-Steuerelementeintrags auf den Link untersuchen . Microsoft Edge DevTools wird für das WebView2-Steuerelement geöffnet:

    

Jetzt können Sie Microsoft Edge DevTools verwenden, um das WebView2-Steuerelement in Ihrer HoloLens 2 WebView2 WinUI 2(UWP)-App zu untersuchen und zu debuggen.

Siehe auch

• Remotedebuggen von WebView2 WinUI 2-Apps (UWP)