移动应用调试之Inspect远程调试

摘自：https://blog.csdn.net/lcyaiym/article/details/78266404

1、准备工做
chrome浏览器，建议最新版本
若是你点击inspect打开的DevTools窗口一片空白，且刷新无效时，那极有多是因为被墙的缘故。
2、Inspect远程调试介绍
开发PC页面的时候使用chrome浏览器的开发者工具，能够很容易的捕获到页面的dom元素，而且能够修改样式，方便调试，可是手机上却很麻烦，由于手机上没有办法直接打开开发者工具查看元素。其实能够经过将设备链接到PC，使用PC的开发者工具检测。
3、Android的Inspect远程调试
一、调试WebView须要知足安卓系统版本为Android 4.4+已上。而且须要再你的APP内配置相应的代码，在WebView类中调用静态方法setWebContentsDebuggingEnabled，以下：

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

二、把Android设备设置为开发者模式，把手机USB调试模式打开(“设置”->”开发人员选项”->”USB调试”)

 

三、将设备经过USB链接到PC，在chrome浏览器地址栏输入：chrome://inspect/#devices

 

 

四、在手机上打开网页的时候，chrome就会检测到网页，点击Inspect就能够直接调试

 

 

3、iOS的Inspect远程调试
一、iOS包应该是debug，release应该不能调试
二、iphone手机 设置 → Safari → 高级 → Web 检查器 → 开
三、安装remotedebug-ios-webkit-adapter

brew update
brew unlink libimobiledevice ios-webkit-debug-proxy
brew uninstall --force libimobiledevice ios-webkit-debug-proxy
brew install --HEAD libimobiledevice
brew install --HEAD ios-webkit-debug-proxy

四、安装最新版本的适配器

npm install remotedebug-ios-webkit-adapter -g

五、启动RemoteDebug iOS WebKit Adapter

remotedebug_ios_webkit_adapter --port=9000

六、在chrome地址栏输入：chrome://inspect/#devices

 

七、在Discover network targets里面增长localhost:9000，就能够在chrome里面调试手机页面了