黄聪：移动应用抓包调试利器Charles

1、Charles是什么？

 

Charles是在 Mac或Windows下经常使用的http协议网络包截取工具，是一款屌的不行的抓包工具，在日常的测试与调式过程当中，掌握此工具就基本能够不用其余抓包工具了。

2、为何是Charles？

为何要用抓包工具？你们在日常移动App调试测试中是如何进行抓包的？

在咱们作开发与测试的过程当中，总免不了碰到网络问题，特别是重后台的产品，这个时候咱们每每的处理方法是抓个网络包，看看到底应用发送和接收了些什么鬼.....这个时候Charles上场了；Charles是一款屌的不行的截包工具，好用到没朋友。

那么Charles屌在哪里呢？？？主要特色以下：

1.支持SSL代理，能够截取分析SSL的请求

2.支持流量控制。能够模拟慢速网络(2G,3G)，以及等待时间较长的请求。

3.支持AJAX调试。能够自动把JSON或者XML数据格式化，方便查看。

4.支持重发网络请求，方便后端调试。

5.支持修改网络请求参数。

6.支持网络请求的截取和动态修改。

7.最重要的一个优势就是有不一样平台的版本（Mac，Windows、Linux）即学一个打遍天下。

3、Charles基本工做原理

charles是经过网络代理来进行抓包的，下面先了解一下http代理的原理：

1.普通http请求过程

 

•通常状况下的HTTP请求与响应：

2.加入了Charles的HTTP代理的请求与响应过程

 

 

中间的代理服务器就是Charles

4、Charles的下载与安装过程

1.官网下载地址：

http://www.charlesproxy.com/download/

2.Mac下安装：

是一个安装包是一个dmg后缀的文件。打开后将Charles拖到Application目录下即完成安装。

 

 

在Mac下你打开Launchpad便可看到一个像花瓶同样的Charles程序图标

3.Windows下安装：

下载后直接双击根据安装向导一步一步安装便可

5、Http抓包操做步骤

Step 1：开启Charleshttp代理；

Step 2：手机端Wifi添加代理；

Step 3：开启Charles录制功能；

Step 4：启动应用开始抓包；

Step 5：分析抓取的数据包。

Step 1: 开启Charleshttp代理

   a.设置Charles代理

 

第一次启动默认会开启本机的系统代理，由于咱们只是监控移动端的因此将此选去除（去掉选项前面的小钩）

a.激活http代理功能

 

 

Step 2: 手机端Wifi添加代理

a. Android手机：

1.在手机端打开你的Wifi设置而后长按已经链接的Wifi在弹出来的菜单中选择【修改网络】

2.沟上[显示高级]选项--【手动】

3.输入代理服务器的IP与端口，IP即安装了Charles的电脑IP地址，端口就是前面一步设置Charles时所设置的端口。

 

注意：手机所链接Wifi要与电脑在同一个LAN(局域网)。

b. iOS手机：

1.点击你所链接的wifi

2.输入代理服务器的IP与端口，

IP即安装了Charles的电脑IP地址，端口就是前面一步设置Charles时所设置的端口。

 

注意：手机所链接Wifi要与电脑在同一个LAN(局域网)。

Step 3:开启Charles录制功能

 

 

1.当手机链接上代理后Charles会弹出相应的提示框，点击Allow便可。2.点击工具栏上的开始录制按钮，即启动了Charles的抓包功能了。

Step 4：启动应用开始抓包

 

1.在手机上操做相应的App进行抓包。2.在Charles的主界面上就可看到相应的请求内容。

Step 5：分析抓取的数据包

 

 

 

1.Charles 主要提供两种查看封包的视图，分别名为 “Structure”和 “Sequence”：

    a.Structure 视图将网络请求按访问的域名分类；

    b.Sequence 视图将网络请求按访问的时间排序。

2.你们能够根据具体的须要在这两种视图以前来回切换。请求多了有些时候会看不过来，Charles提供了一个简单的Filter功能，能够输入关键字来快速筛选出URL 中带指定关键字的网络请求。

3.对于某一个具体的网络请求，你能够查看其详细的请求内容和响应内容。若是请求内容是POST 的表单，Charles 会自动帮你将表单进行分项显示。若是响应内容是 JSON 格式的，那么 Charles能够自动帮你将JSON 内容格式化，方便你查看。若是响应内容是图片，那么 Charles能够显示出图片的预览。

6、Https抓包操做步骤

Step 1：了解一下https的基本原理；

Step 2：在手机端安装SSL证书；

Step 3：激活Charles的SSL代理；

Step 4：将指定的URL请求开启SSL代理功能

Step 5：其余步骤与Http抓包相同，请参考4、Http抓包操做步骤

Step 1：了解一下https的基本原理；

 

 

HTTPS实际上是有两部分组成：HTTP+ SSL / TLS，也就是在HTTP上又加了一层处理加密信息的模块。服务端和客户端的信息传输都会经过TLS进行加密，因此传输的数据都是加密后的数据。具体是如何进行加密，解密，验证的，且看图,下面这个图的解说

详细说明，请参考：

http://blog.csdn.net/clh604/article/details/22179907

Step 2：在手机端安装SSL证书

        1.将证书文件从Charles导出

        2.而后经过adb或者其余工具将其复制到手机的SD卡中。

 

从Charles导出证书文件

      3.将证书文件导入Android手机

 

 

在手机的设置界面找到【安全】---》【从内部存储设备或SD卡安装】----》选择SD卡上的证书---》弹出设置证书名对话框，输入一个易记的名字，而后根据提示进行导入即呵。

4.将证书文件导入iOS手机

 

1.在iPhone手机上打开Safari浏览器，而后在地址栏中输入www.charlesproxy.com/getssl。2.稍后会弹出安装描述文件提示，点击右上角的【安装】按钮进行证书安装便可。

Step 3：激活Charles的SSL代理

 

 

1.选择【Proxy】--->【SSL Proxying Settings..】设置。2.在弹出来的对话框中沟选【Enable SSL Proxying】。

Step 4：将指定的URL请求开启SSL代理功能

 

 

1.选择抓取的https连接，而后右键选择【Enable SSL Proxying】。2.若是不激活SSL代理，因此https请求都是乱码没法查看。

 

 

再次请求这个Https时，其请求内容已经一目了然了。

7、Charles进阶---修改请求也响应的内容

Step 1：设置Charless断点。

Step 2：对指定的URL开启断点功能。

Step 3：编辑请求与响应的内容。

Step 1：设置Charless断点

 

 

选择【Breakpoint Settings…】--->勾选【Enable Breakpoints】来激活断点功能

Step 2：对指定的URL开启断点功能。

 

1.选择一个URL连接-à右键开启菜单---》选择【Breakpoints】便可开启此请求的断点。2.这样Charles会遇到此请求时会弹出中断对话框。

Step 3：编辑请求与响应的内容。

a.编辑请求内容

 

在中断对话框中，用户能够点击Edit Request来编辑请求的内容，编辑完成后而后点击【Execute】发出去这个请求给服务端

b.编辑服务器响应的内容

 

在【Edit Request】对话中点击【Execute】发出请求后，服务端返回来数据后，用户点击【Edit Response】可对响应内容进行编辑完成后而后点击【Execute】发出去这个数据给客户端。

8、Charles进阶---弱网模拟

1.菜单中选择【Proxy】--->【Throttle Settings..】-à激活【Enable Throttling】。

2.在Throttle Configuration设置弱网的参数。

3.如下是各类网制式的速率参考文档：

移动网络制式与网速的参考文档

 

 

弱网模拟设置

做者：luckydaxian连接：https://www.jianshu.com/p/68684780c1b0