一、Charles是什么?
![](https://i-blog.csdnimg.cn/blog_migrate/4759f46c3c12c3bc3f03b138b9688781.webp?x-image-process=image/format,png)
二、为什么是Charles?
为什么要用抓包工具?大家在平常移动App调试测试中是如何进行抓包的?
在我们做开发与测试的过程中,总免不了碰到网络问题,特别是重后台的产品,这个时候我们往往的处理方法是抓个网络包,看看到底应用发送和接收了些什么鬼.....这个时候Charles上场了;Charles是一款屌的不行的截包工具,好用到没朋友。
那么Charles屌在哪里呢???主要特点如下:
1.支持SSL代理,可以截取分析SSL的请求
2.支持流量控制。可以模拟慢速网络(2G,3G),以及等待时间较长的请求。
3.支持AJAX调试。可以自动把JSON或者XML数据格式化,方便查看。
4.支持重发网络请求,方便后端调试。
5.支持修改网络请求参数。
6.支持网络请求的截取和动态修改。
7.最重要的一个优点就是有不同平台的版本(Mac,Windows、Linux)即学一个打遍天下。
三、Charles基本工作原理
charles是通过网络代理来进行抓包的,下面先了解一下http代理的原理:
1.普通http请求过程
![](https://i-blog.csdnimg.cn/blog_migrate/2d36a12d1dea9c1faf4557fb3cc57335.webp?x-image-process=image/format,png)
2.加入了Charles的HTTP代理的请求与响应过程
![](https://i-blog.csdnimg.cn/blog_migrate/28d4c902ae7bbc0eb172a0dac0c65673.webp?x-image-process=image/format,png)
四、Charles的下载与安装过程
1.官网下载地址:
2.Mac下安装:
是一个安装包是一个dmg后缀的文件。打开后将Charles拖到Application目录下即完成安装。
![](https://i-blog.csdnimg.cn/blog_migrate/225fe5d279594554991c92d84285ec20.webp?x-image-process=image/format,png)
3.Windows下安装:
下载后直接双击根据安装向导一步一步安装即可
五、Http抓包操作步骤
Step 1:开启Charleshttp代理;
Step 2:手机端Wifi添加代理;
Step 3:开启Charles录制功能;
Step 4:启动应用开始抓包;
Step 5:分析抓取的数据包。
Step 1: 开启Charleshttp代理
a.设置Charles代理
![](https://i-blog.csdnimg.cn/blog_migrate/eb7d55bf6dce8c24202750016c8bf8ef.webp?x-image-process=image/format,png)
a.激活http代理功能
![](https://i-blog.csdnimg.cn/blog_migrate/49a5daf7d12b8764a323c38dc3b2b271.webp?x-image-process=image/format,png)
Step 2: 手机端Wifi添加代理
a. Android手机:
1.在手机端打开你的Wifi设置然后长按已经连接的Wifi在弹出来的菜单中选择【修改网络】
2.沟上[显示高级]选项--【手动】
3.输入代理服务器的IP与端口,IP即安装了Charles的电脑IP地址,端口就是前面一步设置Charles时所设置的端口。
![](https://i-blog.csdnimg.cn/blog_migrate/3048939297e59b1fad2cecc943536893.webp?x-image-process=image/format,png)
b. iOS手机:
1.点击你所连接的wifi
2.输入代理服务器的IP与端口,
IP即安装了Charles的电脑IP地址,端口就是前面一步设置Charles时所设置的端口。
![](https://i-blog.csdnimg.cn/blog_migrate/9eab311ae1166c4b623ef2bbde4addb5.webp?x-image-process=image/format,png)
Step 3:开启Charles录制功能
![](https://i-blog.csdnimg.cn/blog_migrate/b43e0cce27dcf807ba6ab47e6840e501.webp?x-image-process=image/format,png)
Step 4:启动应用开始抓包
![](https://i-blog.csdnimg.cn/blog_migrate/36f9809c3c72eb869eab4ebde6d5b9da.webp?x-image-process=image/format,png)
Step 5:分析抓取的数据包
![](https://i-blog.csdnimg.cn/blog_migrate/09a40bdcebc45778fcdf454cd08b5e3e.webp?x-image-process=image/format,png)
1.Charles 主要提供两种查看封包的视图,分别名为 “Structure”和 “Sequence”:
a.Structure 视图将网络请求按访问的域名分类;
b.Sequence 视图将网络请求按访问的时间排序。
2.大家可以根据具体的需要在这两种视图之前来回切换。请求多了有些时候会看不过来,Charles提供了一个简单的Filter功能,可以输入关键字来快速筛选出URL 中带指定关键字的网络请求。
3.对于某一个具体的网络请求,你可以查看其详细的请求内容和响应内容。如果请求内容是POST 的表单,Charles 会自动帮你将表单进行分项显示。如果响应内容是 JSON 格式的,那么 Charles可以自动帮你将JSON 内容格式化,方便你查看。如果响应内容是图片,那么 Charles可以显示出图片的预览。
六、Https抓包操作步骤
Step 1:了解一下https的基本原理;
Step 2:在手机端安装SSL证书;
Step 3:激活Charles的SSL代理;
Step 4:将指定的URL请求开启SSL代理功能
Step 5:其他步骤与Http抓包相同,请参考四、Http抓包操作步骤
Step 1:了解一下https的基本原理;
![](https://i-blog.csdnimg.cn/blog_migrate/7ec77276b5470fcaec3c477427c3ee96.webp?x-image-process=image/format,png)
详细说明,请参考:
Step 2:在手机端安装SSL证书
1.将证书文件从Charles导出
2.然后通过adb或者其他工具将其复制到手机的SD卡中。
![](https://i-blog.csdnimg.cn/blog_migrate/c8a4beca60f5a5394aee376206f8e265.webp?x-image-process=image/format,png)
3.将证书文件导入Android手机
![](https://i-blog.csdnimg.cn/blog_migrate/dcbc1bba126ed9500f5f79d05c0c7a52.webp?x-image-process=image/format,png)
4.将证书文件导入iOS手机
![](https://i-blog.csdnimg.cn/blog_migrate/05c619af6beb2f77d26a500bd4ef8434.webp?x-image-process=image/format,png)
Step 3:激活Charles的SSL代理
![](https://i-blog.csdnimg.cn/blog_migrate/84b5e1b63489aa4521a71fc2378a5e33.webp?x-image-process=image/format,png)
Step 4:将指定的URL请求开启SSL代理功能
![](https://i-blog.csdnimg.cn/blog_migrate/75423e2c9c3b9f8babf637a4cae59159.webp?x-image-process=image/format,png)
![](https://i-blog.csdnimg.cn/blog_migrate/ff005ff6410f0ab51c2533fa69ce7e0a.webp?x-image-process=image/format,png)
七、Charles进阶---修改请求也响应的内容
Step 1:设置Charless断点。
Step 2:对指定的URL开启断点功能。
Step 3:编辑请求与响应的内容。
Step 1:设置Charless断点
![](https://i-blog.csdnimg.cn/blog_migrate/902992c42b44ff9f1c701a8bc5d771a1.webp?x-image-process=image/format,png)
Step 2:对指定的URL开启断点功能。
![](https://i-blog.csdnimg.cn/blog_migrate/ee3343d6bcafa3fab595a38129cd25f2.webp?x-image-process=image/format,png)
Step 3:编辑请求与响应的内容。
a.编辑请求内容
![](https://i-blog.csdnimg.cn/blog_migrate/b21c72efa0b717569db69557423fbd42.webp?x-image-process=image/format,png)
b.编辑服务器响应的内容
![](https://i-blog.csdnimg.cn/blog_migrate/b755af3cfd17e2e098a026e72cb3d7c2.webp?x-image-process=image/format,png)
八、Charles进阶---弱网模拟
1.菜单中选择【Proxy】--->【Throttle Settings..】-à激活【Enable Throttling】。
2.在Throttle Configuration设置弱网的参数。
3.以下是各种网制式的速率参考文档:
![](https://i-blog.csdnimg.cn/blog_migrate/d5e35f4ab4b5ac34369ceb176be10c3b.webp?x-image-process=image/format,png)