使用Chrome DevTool调试iOS设备的webView（iOS WebKit Debug Proxy）

iOS WebKit Debug Proxy的原理是在本地起了一个代理做WebInspector到WebKit远程调试的协议转发。ios_webkit_debug_proxy（以下简称iwdp）允许开发者通过Chrome DevTools UI和Chrome Remote Debugging Protocol来检查模拟器和真机上MobileSafari和UIWebview。

Mac安装

brew install ios-webkit-debug-proxy

如果顺利的话，你应该不会看到错误
我当时安装的版本是 1.6 。需要注意的是这个版本只是支持iOS9.x 的设备。

使用方法

模拟器一定要在iwdp之前启动，iwdp启动提供了三种方式（如下），一般选择第一种就好了

# Xcode changes these paths frequently, so doublecheck them
SDK_DIR="/Applications/Xcode.app/Contents/Developer/Platforms/iPhoneSimulator.platform/Developer/SDKs"
SIM_APP="/Applications/Xcode.app/Contents/Developer/Applications/Simulator.app/Contents/MacOS/Simulator"
$SIM_APP -SimulateApplication $SDK_DIR/iPhoneSimulator8.4.sdk/Applications/MobileSafari.app/MobileSafari

模拟中的Safari也要开启inspector

通过Settings > Safari > Advanced > Web Inspector = ON 来开启

浏览和查看可以debug的tabs

在chrome浏览其中打开 location:9221 。 你将可以看到所有建立连接的设备。
如果连接正常的话，可以看到 location:9222 这样的列表，并且是可以点击的。 如果不能点击说明就没有连接成功

点击列表中的某个连接之后，可能会出现下面的提示：

**Note:** Your browser may block1,2
the above links with JavaScript console error:
Not allowed to load local resource: chrome-devtools://...
To open a link: right-click on the link (control-click on Mac), 'Copy Link Address', and paste it into address bar.

按照提示，右键复制“chrome-devtools://...”这样的连接，在新的chrome tab中打开，就可以愉快的debug。

源码地址： https://github.com/google/ios-webkit-debug-proxy
以上