强制开启android webview debug模式使用Chrome inspect

末蓝、 2022-07-24 07:29 403阅读 0赞

原作者：袁飞翔

## 一、参考资料 ##

Google官方文档：[https://developers.google.com/web/tools/chrome-devtools/debug/remote-debugging/remote-debugging][https_developers.google.com_web_tools_chrome-devtools_debug_remote-debugging_remote-debugging]

## 二、普通h5页面手机端调试 ##

此种方式最简单，在安卓手机中安装安卓版 chrome，USB 连接 PC，然后在 PC 的 chrome 浏览器中打开 chrome://inspect 即可。

## 三、基于webkit核心的webview端调试 ##

从 **Android 4.4** 开始，webkit是支持远程调试的，不过需要将app的debug模式打开，可以使用如下代码：

WebView.setWebContentsDebuggingEnabled(true);

由于大部分 App 的 debug 模式是关闭的，即便是内部 App，比如 QQ/微信，要去找一个开启了debug 模式的版本还是比较麻烦的。因此需要使用借助第三方工具来强制开启任何 App 的 **Android webview debug模式**，使之可以使用 chrome inspect。**而这个工具就是 Xposed** 。

我们已经提供了一份要安装的文件，请首先到 [https://github.com/feix760/WebViewDebugHook][https_github.com_feix760_WebViewDebugHook] 下载文件。

### 1、root设备 ###

因为涉及到 root 权限，因此需要将手机进行 root。有很多工具可以来 root，比如KingRoot、一键root、360一键root等。如果你安装了QQ电脑管家，可以在“电脑管家-工具箱-其他”列表里面看到KingRoot。

### 2、安装xposed框架 ###

在下载文件的hook.zip中，找到 **de.robv.android.xposed.installer\_v33\_36570c.apk**，安装之。也可以去 [官网][Link 1] 下载。

### 3、安装xposed webview debugging模块 ###

在下载文件的hook.zip中，找到 **WebViewDebugHook.apk**，安装之。

### 4、激活Xposed ###

安装后上述两个apk之后，可以看到手机上面出现了一个叫 **Xposed Installer** 的图标，点击进去之后会看到提示说Xposed未激活，点击红色字体部分，会切换到另外一条页面，点击“安装/更新”按钮即可。

![这里写图片描述][20160517172824446]

但有部分手机会出现类似如下的错误，导致无法点击“安装/更新”，目前已知的是部分版本的MIUI是会出现这个问题的。

![这里写图片描述][20160517172841119]

安装完成之后，重启再打开，再点击刚才点击过的地方，切入页面之后，勾选，再重启，重启之后即激活了Xposed。

![这里写图片描述][20160517172856494]

![这里写图片描述][20160517172916923]

### 5、关于QQ等 ###

QQ等默认会使用X5内核，把下载文件中的 **debug.conf** 放在sd卡根目录下就可以强制它使用 Android 自带 webview 。

### 6、测试 ###

手机usb连接电脑，使用 chrome 打开 chrome://inspect ，然后打开任意 App 的 webview ，接下来就是见证奇迹的时候了。

[https_developers.google.com_web_tools_chrome-devtools_debug_remote-debugging_remote-debugging]: https://developers.google.com/web/tools/chrome-devtools/debug/remote-debugging/remote-debugging
[https_github.com_feix760_WebViewDebugHook]: https://github.com/feix760/WebViewDebugHook
[Link 1]: http://repo.xposed.info/module/de.robv.android.xposed.installer
[20160517172824446]: /images/20220722/a48ebec7f8854632ba2a9ac8bda1a68c.png
[20160517172841119]: /images/20220722/7feadbeb3e1342e2808a1ab2daac5271.png
[20160517172856494]: /images/20220722/abb40719a826487b9070ab29cbaa54e3.png
[20160517172916923]: /images/20220722/d2ce864e14434d21b207d70522f79581.png