前言
曾经对这一块不知道多熟悉,一年多没接触移动端开发,竟然连远程调试怎么打开都不记得了,所以看来啊,任何东西无论多简单都要做笔记,这是这的!
下面开始
其实真的非常简单!
第一步,开启USB调试模式
这个就不用细说了,是个人都知道怎么开启。
第二步,连接手机和电脑
连上基本就不用管了,驱动都不用装,这个后面再细说。
第三步,手机使用Chrome访问任一网站
也可以不使用Chrome,但是使用Chrome最简单,我们依然再后面细说。用手机版Chrome打开某一网站,比如 https://haoji.me
第四步,电脑使用Chrome调试
打开Chrome,访问chrome://inspect/ ,不出意外的话你的手机型号就会出现在这里,使用手机版Chrome打开了某个页面的话也会出现在这里,点击inspect
就可以调试了,但是第一次打开你会发现一直在转啊转,因为需要加载墙外的一些文件,所以第一次需要翻墙,以后就不需要了,具体怎么翻,我这里就不多说了,一千个哈姆雷特,有一千个翻墙方法。
打开后是这样的,至于为什么有时候Elements等面板一片空白,还在找原因中:
补充说明
关于驱动
试过很多遍确实是这样,即使adb无法正常连接手机,但是Chrome的远程调试却可以正常显示,貌似底层实现不是依赖adb,这个不太确定。而adb连接手机失败的几率就太大了,adb连接手机一般都是要求安装手机驱动的。
关于移动端使用的浏览器
移动端Chrome不需要任何设置即可开启远程调试,其它第三方浏览器(如UC、QQ浏览器)的话,貌似没听说过如何开启远程调试的,如果是自己app里面定制的webview
,需要通过如下方式主动开启(默认是关闭的),一般建议用一个开关参数来控制开启与否,开发时开启,上线后关闭:
@TargetApi(Build.VERSION_CODES.KITKAT)
public void setRemoteDebug(boolean enabled)
{
if(Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT)
{
// 开启Chrome远程调试功能,要求安卓版本>=4.4
WebView.setWebContentsDebuggingEnabled(enabled);
}
}
关于页面可以预览但无法看到代码的问题
这个还在找原因中。