调试iOS H5 项目的另一种选择-ios-webkit-debug-proxy

阅读本文之前建议先看一遍移动前端开发调试。上文中详细介绍了通过Safari 进行iOS 上H5 页面的模拟器和真机调试，能解决大部分的调试场景。但是Google 给我们提供了另一种方式——[ios-webkit-debug-proxy。

 为什么要用ios-webkit-debug-proxy

1、 iOS 上的H5 只能使用Safari调试，之前一直用Chrome，Safari 的调试功能太难用- 如果你在UIWebView中注入一段js，Safari 并不能看到。[WebViewJavascriptBridge](https://github.com/marcuswestin/WebViewJavascriptBridge) 就是在webview 中注入了jsbridge。

2、 使用Linux 作为开发机的朋友。 注意，通过企业证书In house发布的测试客户端还是不能调试，所以对于大企业的很多人来说，证书问题一直都是问题。

3、 自动化测试相关的目的,搜索ios-webkit-debug-proxy 看看是不是你想要的。

4、 ......

使用

项目的README 中有详细介绍。我只说下mac 下的使用

 安装

brew install ios-webkit-debug-proxy

Start the proxy

提前打开模拟器，用USB连接真机。

// -f 参数直接指定使用chrome的devtools作前端。

ios_webkit_debug_proxy -f chrome-devtools://devtools/bundled/inspector.html

在Chrome中打开页面

chrome-devtools://devtools/bundled/inspector.html?ws=localhost:9222/devtools/page/1

 这里有个坑点是，没法像Safari 一样，直接选择打开哪一个页面调试，而是通过上面链接最后的page/1确定。

现在浏览器输入：http://127.0.0.1:9222 ，然后看排序，先手动改吧。

此时就能愉快的调试页面了。

如果到此没有成功，请查看README, 我只是想说明有这个东西的存在，并且能解决一部分问题而已。

博客：http://www.chaoc.cn