Android的原生APP如何调试嵌入的H5页面

最新推荐文章于 2025-06-09 21:37:22 发布

Z_yq

最新推荐文章于 2025-06-09 21:37:22 发布

阅读量9.4k

点赞数 3

CC 4.0 BY-SA版权

分类专栏：安卓开发技术

本文链接：https://blog.csdn.net/yeluofengchui/article/details/93330467

前言

现在原生app中混合web页面这种方式用的场景越来越多，app的原生代码很容易使用android studio进行debug调试，web页面在Chrome浏览器中F12打开开发者工具，也非常方便调试web页面。但是嵌入在app中的web页面如何调试代码呢？
使用混合开发WebView调试必备神器DevTools。

使用DevTools进行调试

准备工作

1.设置Webview调试模式
可以在Activity的init进行如下设置，WebView类包含一个公共静态方法，可应用于项目中的所有WebView，同时不受Manifest文件中的debuggable属性影响。(Android版本应该在Android 4.4（KitKat）或更高版本上)

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

2.首先Android手机需要打开开发者模式，并允许USB调试。将手机与电脑相连。
3.打开Chrome浏览器，在地址栏输入 chrome://inspect , 此时手机上会收到授权，点击允许.如果（可能没有如果）你的电脑无法访问 developers.google ，那么你需要先想办法连上一下（hosts、墙或vpn），因为需要自动下载手机的驱动。
4.可以了,在Devices列表中可以看到连接的手机。手机上打开要调试的页面，在Chrome中点击相应页面链接，即打开调试器。