使用 Chrome 开发者工具进行调试

您可以使用开发机器上运行的 Chrome 浏览器中内置的开发者工具,远程检查和调试应用中运行的 WebView。如需有关 WebView 远程调试的详细指南,请参阅远程调试 WebView

如需详细了解开发者工具,请参阅 Chrome 开发者工具概览

启用来自 Chrome 开发者工具的连接

应用的 WebView 默认不会启用来自 Chrome 开发者工具的连接。您必须在应用的代码中启用 WebView 调试。

  1. 确保您已设置好在硬件虚拟设备上运行应用。
  2. 通过调用 setWebContentsDebuggingEnabled 在应用代码中启用 WebView 调试。这通常在初始化 WebView 的 ActivityApplication 类中完成。

我们建议将 setWebContentsDebuggingEnabled 封装在条件检查中,以便仅在开发 build 中启用调试,而不是在生产 build 中启用。此设置适用于应用中的所有 WebView。

WebView 调试不受应用清单中 debuggable 标志状态的影响。如果您只想在 debuggable 标志设置为 true 时启用 WebView 调试,请在运行时测试此标志,如以下示例所示:

Kotlin

if (applicationInfo.flags and ApplicationInfo.FLAG_DEBUGGABLE != 0) {
     WebView.setWebContentsDebuggingEnabled(true)
}

Java

if (0 != (getApplicationInfo().flags & ApplicationInfo.FLAG_DEBUGGABLE)) {
     WebView.setWebContentsDebuggingEnabled(true);
}

开始调试 WebView

在应用代码中启用 WebView 调试功能,并且应用在实体设备或 Android 模拟器上运行后,将 Chrome 开发者工具连接到 WebView:

  1. 在开发机器上打开 Chrome。
  2. 前往“chrome://inspect”。
  3. chrome://inspect 页面上,确保已选中发现 USB 设备。在 Remote Target(远程目标平台)部分中找到您的设备。

    Chrome 开发者工具检查网页,显示可用于调试的远程目标
    图 1.Chrome 开发者工具检查页面,显示可用于调试的远程目标。
  4. 在设备名称下方,Chrome 会列出在该设备上运行的所有已启用调试功能的 WebView,通常以 WebView in 开头,后跟应用的软件包名称。找到要调试的 WebView,然后点击检查链接。

您会看到一个新的开发者工具实例打开,您可以使用该实例检查 WebView。

如果您要从开发机器上的本地 Web 服务器提供内容,请参阅从 WebView 访问本地开发服务器,了解如何从设备或模拟器连接到该服务器。如需进行问题排查,请参阅远程调试 Android 设备远程调试 WebView