远程调试 Xbox WebView2 WinUI 2 (UWP) 应用

项目
12/21/2023

若要使用 Microsoft Edge DevTools 调试 WebView2 WinUI 2 (UWP) 应用，请使用远程调试。 WebView2 WinUI 2 (UWP) 应用需要远程调试，因为目前，内置 DevTools 无法在应用商店签名的 WebView2 WinUI 2 (UWP) 应用中启动。

将 DevTools 远程附加到 Xbox WebView2 WinUI 2 (UWP) 应用

将 Microsoft Edge DevTools 远程附加到 Xbox WebView2 WinUI 2 (UWP) 应用，如下所示：

在 Microsoft Edge 中，转到 edge://inspect。此时会打开 “使用 Edge 开发人员工具进行检查” 页：
在 Xbox 上启用开发人员模式。请参阅 Xbox One 开发人员模式激活。
在 Microsoft Edge 中，转到 https://<System IP>:11443，其中 <System IP> 替换为 Xbox 系统 OS IP。 Windows 设备门户选项卡中会显示“确认安全设置”页：
单击“ 使用不安全的连接继续” 按钮。出现 SSL 证书错误： NET：：ERR__CERT_AUTHORITY_INVALID：
单击“高级”按钮。将显示一条消息，“服务器无法证明...”：
单击“继续”以 <System IP> (不安全) 链接，其中 <System IP> 替换为你的 Xbox 系统 OS IP。 Xbox 设备门户打开：
转到 https://<System IP>:11443/config/rootcertificate，其中 <System IP> 替换为你的 Xbox 系统 OS IP。这会下载文件 rootcertificate.cer ：
打开下载 rootcertificate.cer 的文件。此时会打开一个安全警告对话框：
单击“ 打开 ”按钮。此时会打开 “证书 ”对话框：
单击“ 安装证书 ”按钮。此时会打开 “欢迎使用证书导入向导 ”对话框：
选择“ 当前用户 ”选项按钮，然后单击“ 下一步 ”按钮。此时会打开“证书导入向导”：
选择“ 将所有证书放入以下存储区”选项，单击“ 浏览 ”按钮，然后选择“ 受信任的根证书颁发机构”。
单击“ 下一步 ”按钮。此时会打开 “安全警告 ”对话框：
单击“ 是 ”按钮。
重启Microsoft Edge。
转到 https://<System IP>:11443，其中 <System IP> 替换为 Xbox 系统 OS IP，并验证连接是否指示为安全 (即 HTTPS URL) ：
在应用项目中，设置以下变量，以配置 WebView2 WinUI 2 (UWP) 应用进行远程调试。

若要启用远程调试，必须在项目中设置环境变量。必须在创建 CoreWebView2 实例之前以及设置属性或调用方法之前设置 WebView2.Source 此 WebView2.EnsureCoreWebView2Async 变量。
```
"WEBVIEW2_ADDITIONAL_BROWSER_ARGUMENTS", "--enable-features=msEdgeDevToolsWdpRemoteDebugging"
```
例如，如果使用的是 WebView2 示例 UWP 应用，可以通过在文件中添加以下行 Browser.xaml.cs 来设置环境变量：
```
Environment.SetEnvironmentVariable("WEBVIEW2_ADDITIONAL_BROWSER_ARGUMENTS", "--enable-features=msEdgeDevToolsWdpRemoteDebugging");
```
此屏幕截图中的构造函数中的Browser()行编号为 33，位于包装现有SetEnvironmentVariable语句的下方#endif：
使用 Xbox Device Portal 将应用部署到 Xbox，然后启动应用。
转到 edge://inspect。
在 “连接到远程 Windows 设备 ”文本框中，输入 https://<System IP>:11443，其中 <System IP> 替换为你的 Xbox 系统 OS IP，然后单击“ 连接到设备 ”按钮。
验证是否可以成功连接，以便在计算机名称下列出可调试的 WebView2 控件（名为 Edge）：
在 Edge WebView2 控件项的底部，单击检查链接。为 WebView2 控件打开Microsoft Edge DevTools：