在 iPhone 中调试, 大体上与上文 安卓中的移动页面调试 类似, 区别主要是 iOS 系统中的一些限制, 导致某些工具无法使用
本文基于此, 简要介绍在 iPhone 中如何调试页面
最终可以实现在 Mac 平台使用 Safari(或结合 ios_webkit_dubug_proxy 使用 Chrome) 调试手机中 Safari 的页面, 结合 Charles 进行抓包请求断点, 再通过微信 ipa 包重签名来调试微信的 WKWebView
在 Windows 中结合 Fiddler 与 ios_webkit_debug_proxy 中转实现 Chrome 调试手机的 Safari 浏览器
一能够访问页面
某些页面需要设置 HOST 才能进行访问, 在 iPhone 上不好设置 HOST, 所以需要一些代理工具帮助我们
除了 Windows 平台中常用的代理调试工具 Fiddler 之外, 还可以使用 Mac 中的常用代理工具 Charles
Fiddler
与上文类似, 在 iPhone 中的 WiFi 设置里面, 设置代理为 Windows 的 ip:host, 如果需要访问 HTTPS 的页面还需要设置证书
Charles
在手机上设置好代理后, 访问页面时在 Charles 中统一请求接入即可
当需要进行 HTTPS 页面的访问时, 也需要在 Mac 和 iPhone 中都设置好证书
安装后可在 Mac 证书列表中看到
并设置相关的域
根据 Charles 的提示, 手机连接代理之后访问 chls.pro/ssl 安装证书, 再访问即可
而对于某些需要账号授权登陆的页面, 涉及到 Cookie 的模拟登录, 可以使用这两个代理工具进行设置
在 Fiddler 中可以按前文安卓的配置
在 Charles 中也有对应的方法
二审查元素查看页面输出
可以使用 Chrome 的设备模拟来查看页面
不过对于 iPhone 的调试, 还需要进行真机的页面查看
一般来说, iPhone 中的页面是在 Safari 浏览器中查看的
微信中的内置浏览器是 WKWebView 内核或 UIWebView ,WKWebView 的版本依赖于 IOS 的版本其中 UIWebViewer 只是系统浏览器的一部分组建, 功能不全或有所 限制
所以某些情况下可直接在手机的 Safari 浏览器进行查看调试, 某些情况还是少不了在微信内置浏览器中进行
Safari 远程调试
这个方法需要结合 Mac 的 Safari 浏览器使用, 通过 Mac 与 iPhone 进行连接来调试
手机上访问某个页面, 选取进行调试, 将会打开 Safari 的开发者工具, 可以看到熟悉的几个面板
除了审查元素查看日志之外, 还可进行脚本的断点调试, 查看网络请求等操作
不过功能相对 Chrome DevTools 来说, 相对简单了些, 对于简单的页面可直接使用
对于高版本的 iOS 系统 (如 iPhone 7), 进行远程调试的 Mac 主机的系统版本也有限制, 并非任何 Mac 和 iPhone 之间都能进行调试
此外, 这种远程调试仅支持调试手机的 Safari 浏览器, 无法调试微信的内置浏览器
基于 Weinre 的调试
参考前文
基于微信开发者工具的调试
参考前文
与前文类似, 这两种方法都能进行基础的页面信息查看, 不支持 HTTPS, 使用 spy-debugger 可支持 HTTPS
基于 spy-debugger 的调试
参考前文, 设置好相应的 HTTPS 证书
基于 ios-webkit-debug-proxy 的调试
Mac 上的 safari 调试功能不够好, 而且不能调试微信中的页面, 使用 weinre 只能简单地调试微信页面, 无法进行脚本断点等高级功能
最好的办法莫过于让 iPhone 可 Chrome Devtools 进行连接, 充分利用好的调试工具与现有的平台, 进行调试
ios-webkit-debug-proxy 支持多平台, 这么来说我们可以不借助 Mac 主机实现调试 iPhone 的需求不过配置过程稍微有些繁琐
在 Mac 中安装
在前面 install 前面加上参数是因为 brew 的 update 太慢了, 手动设置成不需要 update
另外, 可以看到报错了, 在这里设置权限即可
在手机打开某个页面, 然后访问 localhost:9221 , 即可进行调试
或者之间在 chrome 中输入 chrome://inspect 也可看到相应信息
美中不足还是无法检测微信中的页面
在 Windows 中配置
在 windows 中配置相对麻烦了些, 首先需要安装 powershell(win10 中已经自带), 然后安装 scoop , 再安装这个插件
安装 powershell3: https://www.microsoft.com/en-us/download/details.aspx?id=34595
安装 scoop: iex (new-object net.webclient).downloadstring('https://get.scoop.sh')
安装 git: scoop install git
关联包集: scoop bucket add extras
安装工具: scoop install ios-webkit-debug-proxy
USB 连接设备 (或模拟器)
开启 ios_webkit_debug_proxy -f chrome-devtools://devtools/bundled/inspector.html(参数免 FQ)
设置 Chrome://inspect 中监听端口
如果没有设备列表, 可能需要安装 iTunes 来获取 (间接地使用授权功能)
同样地, 访问相应的页面
或者使用 Chrome 自身的 DevTools 来调试, 即可实现在 Window 中调试手机 Safari 页面 (然而还是不支持微信内置的)
调试微信内置的 webview
要调试微信内置的 webview, 就需要对其进行重签名打包, 让 iOS 觉得我们是微信这个 APP 的开发者 (苹果的限制太多了)
相关链接 相关链接
相关步骤:
在现有证书基础上 (如果没有证书需要自己设置)
1. 下载 IPAPatch , 解压
可以看到如下文件信息
2. 下载越狱版的微信 ipa(尽量通过正规渠道获取, 也可直接在 PP 助手下载, 下载的时候不要连接手机)
ipa 是 iOS 的应用程序文件包, 类似安卓中的 apk, 正常版本的带有加密信息, 打包后会出问题, 越狱版已经去壳, 可以签入我们的证书
3. 将 IPAPatch 文件夹中的 /Assets/app.ipa 替换成这个微信 ipa
4. 用 XCode 打开 /IPAPatch.xcodeproj
5. 设置 一个新的 BundleID, 选用 AppleID Team, 设置 Code Signing, 选择真机 target, 然后运行安装即可
遇到报错信息就按提示进行解决
可能遇到的问题有:
no matching provisioning profiles found 确认是否配置了证书, 简单的操作可以直接按提示进行 fixed
Code signing is required for product type 'Framework' in 不要忘了设置 Framework 中的签名
Xcode: failed to get the task for process 打开应用是会伴有闪退现象 签名需要使用开发版 (iOS Developer), 不要使用发布版 (iOS Distribution),ipa 包需使用越狱版
Xcode Device Locked When iPhone is unlocked 记得在手机上选择信任电脑
could not find developer disk image 低版本的 XCode 不包含新版 iOS 的系统依赖, 需要更新 XCode 为最新版, 或者直接下载对应的包, 放到 XCode 的包目录中
安装成功后一直停留在启动画面 可能是 XCode 开启了调试断点功能, 取消即可
安装之后原有微信应用打不开了, 如果使用不恰当的 ipa 包, 会有意外的副作用, 所以得谨慎选择 ipa 包
安装成功后, 即可打开新的微信使用
登陆后, 访问相关页面, 就可以调试 webview 了
方法同上, 可在 Mac 上使用 Safari 来调试内置浏览器的页面, 公众号, 小程序等
或者, 直接使用我们的 windows 系统, 开启 ios_webkit_debug_proxy 后, 在 Chrome 中调试即可
来源: https://www.cnblogs.com/imwtr/p/8675701.html