如何调试.NET MAUI非Blazor Android应用中的WebView？

在非Blazor的.NET MAUI应用中，我使用WebView控件渲染运行时生成的HTML页面（EPUB电子书页面），其中包含大量JavaScript代码。需要对WebView进行检查并使用调试工具排查JS相关问题。此前开发UWP应用时曾使用Edge DevTools预览版，现在寻找适用于Android平台MAUI应用的类似工具，针对Blazor应用的builder.Services.AddBlazorWebViewDeveloperTools()方法在我的场景中无效。

方法一：Chrome DevTools调试Android WebView #

• 前置操作：开启Android设备的开发者选项和USB调试功能，将设备通过USB连接到电脑。
• 调试步骤：
  1. 在电脑上打开Chrome浏览器，输入地址chrome://inspect并访问。
  2. 在页面中找到已连接设备下的你的MAUI应用，找到对应WebView实例后点击inspect按钮，即可打开调试面板。
  3. 调试面板支持Elements（查看DOM结构）、Console（查看JS日志/执行代码）、Sources（断点调试JS）等功能，和网页调试逻辑完全一致。
• 关键配置：在MAUI的Android项目中，需确保WebView开启必要设置：

  // 启用JS支持（必备，否则无法调试JS）
  webView.Settings.JavaScriptEnabled = true;
  // 全局开启WebView调试（仅在Debug模式下使用）
  Android.Webkit.WebView.SetWebContentsDebuggingEnabled(true);
  

方法二：Edge DevTools调试 #

如果习惯使用Edge的调试工具，操作流程和Chrome一致：

• 打开Edge浏览器，输入地址edge://inspect访问。
• 连接设备后找到MAUI应用中的WebView实例，点击inspect即可启动调试，功能和Chrome DevTools基本一致，适合延续之前UWP的使用习惯。

内容的提问来源于stack exchange，提问作者ac-lap