在 iPhone 上利用 Charles 抓包
一、抓包使用场景
在开发过程中,通常我们会遇到系列问题:
1、在与后台联调的过程中不断的下断点或者输出 log ,以查看给后台的参数是否正确,后台返回给我们的结果是否有误。打断点耗时,大量输出 log 是代码不够整洁。
2、在我们没有修改代码的情况下出现问题,想找出是后台的锅还是我们的锅。
二、抓包软件
抓包软件有很多比如: wireshark、Charles、Fiddler 等。
本文以 Charles 为例。
三、如何在iPhone上抓包
- 3.1 在 Mac 上安装抓包软件 Charles
-
3.2 在电脑上打开软件,并在手机上设置 HTTP 代理
iPhone 代理设置.jpg
点击无线局域网后面的详情,拉到最后面,找到 HTTP 代理,点击配置代理,选择手动,并填写 服务器地址(你的电脑 IP 地址),端口(默认 8888)
-
3.3 填写完成后并保存后,随便打开一个网址,电脑端应该后弹出提示,请点击 Allow。
确认弹窗.jpg
此时应该已经可以看到手机发出的请求了。但是同时你会发现,很多请求前面有个小锁,我们无法查看请求信息。这是因为这些请求是 HTTPS 请求。下面我们来讲怎么进行 HTTPS 抓包。
四、HTTPS 抓包
- 4.1 安装证书
Install Charles Root Certificate.png在 Charles 的菜单栏点击 help => SSL Proxying => Install Charles Root Certificate
在添加证书的弹窗中点击 “添加”,此时证书被添加到“钥匙串”,但是还没有结束,因为证书默认是不信任状态,我们还要把证书改成信任状态。
添加.png
信任证书.png在钥匙串中搜索 “ Charles ”找到证书,双击证书,并选择 始终信任
- 4.2 在iPhone上安装证书
- 4.2.1 在mac上保持 Charles 打开状态,iPhone 和 Mac处于同一网络中。在iPhone 的 Safari 中打开如下网址:
- 4.2.2 此时会弹出一个弹窗询问师傅允许添加描述文件,点击允许,并安装证书。
- 4.2.3 在 iPhone 上信任证书
设置 = > 关于本机 => 证书信任设置 =>信任
图示如下:
iPhone 证书设置 .png- 4.3 SSL 代理设置
Charles 菜单栏 => Proxy => SSL Proxying Settings =>add 添加主机和端口。
图示如下,以微博为例:
SSL Proxying Settings .png添加主机和端口
主机和端口.png不出意外的话你应该可以看到微博的接口数据了,大功告成。
success.png五、抓指定接口数据
抓包你已经学会了,但是有时候我们会发现我们的手机和电脑无时无刻不在发送和接受数据,造成 Charles 的导航栏很乱,影响观感。只想抓取我们想要的接口的数据,解决方案如下:
- 5.1 过滤
录制设置.pngCharles 菜单栏 => Proxy => Recoding Settings =>Include =>add (添加相关信息,支持通配符)。
比如我们只想抓微博的数据,则填写如下规则
过滤.png规则生效后的效果:只有微博的借口数据。
(大多数软件可能有多个服务器,请根据实际情况填写规则)