App内嵌H5页面调试利器 chrome://inspect

来源:https://developers.google.com/web/tools/chrome-devtools/remote-debugging/webviews

个人测试相当好用,但是需要安卓开发人员对你要调试页面的webview添加setWebContentsDebuggingEnabled。的调用,见下文加粗部分。这个一般都是测试包内用的,所以一般都是单独加上给你来个测试包供你测试用的。不过相当好用。每次打开新的webview都会在页面中生成一个新的inspect让你点的,像下面这样。


App内嵌H5页面调试利器 chrome://inspect_第1张图片

以下是原文。

远程调试 WebView

By Meggin Kearney

Meggin is a Tech Writer

使用 Chrome 开发者工具在您的原生 Android 应用中调试 WebView。

在 Android 4.4 (KitKat) 或更高版本中,使用 DevTools 可以在原生 Android 应用中调试 WebView 内容。

TL;DR

在您的原生 Android 应用中启用 WebView 调试;在 Chrome DevTools 中调试 WebView。

通过 chrome://inspect 访问已启用调试的 WebView 列表。

调试 WebView 与通过远程调试调试网页相同。

配置 WebViews 进行调试

必须从您的应用中启用 WebView 调试。要启用 WebView 调试,请在 WebView 类上调用静态方法 setWebContentsDebuggingEnabled。

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {WebView.setWebContentsDebuggingEnabled(true);}

此设置适用于应用的所有 WebView。

提示:WebView 调试不会受应用清单中 debuggable 标志的状态的影响。如果您希望仅在 debuggable 为 true 时启用 WebView 调试,请在运行时测试标志。

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {if (0 != (getApplicationInfo().flags & ApplicationInfo.FLAG_DEBUGGABLE)){ WebView.setWebContentsDebuggingEnabled(true); }}

在 DevTools 中打开 WebView

chrome://inspect 页面将显示您的设备上已启用调试的 WebView 列表。

要开始调试,请点击您想要调试的 WebView 下方的 inspect。像使用远程浏览器标签一样使用 DevTools。

与 WebView 一起列示的灰色图形表示 WebView 的大小和相对于设备屏幕的位置。如果您的 WebView 已设置标题,标题也会一起显示。

故障排除


App内嵌H5页面调试利器 chrome://inspect_第2张图片

在 chrome://inspect page 上无法看到您的 WebView?

验证已为您的应用启用 WebView 调试。

在设备上,打开应用以及您想要调试的 WebView。然后,刷新 chrome://inspect 页面。

Except as otherwise noted, the content of this page is licensed under the Creative Commons Attribution 3.0 License, and code samples are licensed under the Apache 2.0 License. For details, see our Site Policies. Java is a registered trademark of Oracle and/or its affiliates.

上次更新日期:七月 17, 2018


发现这么一篇,相互补充吧。https://www.jianshu.com/p/0797949275ee

你可能感兴趣的:(App内嵌H5页面调试利器 chrome://inspect)