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

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

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

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

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

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

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

三、iOS的Inspect远程调试
1、iOS包应该是debug，release应该不能调试
2、iphone手机 设置 → Safari → 高级 → Web 检查器 → 开
3、安装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

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

npm install remotedebug-ios-webkit-adapter -g

5、启动RemoteDebug iOS WebKit Adapter

remotedebug_ios_webkit_adapter --port=9000

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

7、在Discover network targets里面增加localhost:9000，就可以在chrome里面调试手机页面了