使用Charles抓包、模拟弱网和篡改请求

山茶花读不懂白玫瑰，北山的风吹不到南山尾。
大家好，当我们在测试移动端应用遇到错误提示时，一般会先尝试定位该错误的原因是前端还是服务端，所以需要知道对应操作背后接口的请求与响应情况，再就是如果我们需要模拟一些极端场景时，可能需要篡改接口的请求或响应，这时，我们就需要借助工具，本文将给大家分享一款网络封包分析工具Charles，希望能给大家带来一定的帮助。

目前主流的网络封包分析工具有：WireShark、Charles、Fiddler等

Charles是在Windows系统下常用的网络抓包工具，在做移动APP开发或测试时，为了调试与服务器端的网络通讯，常常需要抓包来分析。

Charles通过将自己设置成系统的网络访问代理服务器，使所有的网络访问请求都通过它来完成，从而实现了网络数据包的截取和分析。

除了在做移动开发调试外，Charles也可以用于分析第三方应用的通讯协议。配合Charles的SSL功能，Charles还可以分析Http/Https 协议。

Charles 是收费软件，可以免费试用 30 天。试用期过后，未付费的用户仍然可以继续使用，但是每次使用时间不能超过 30 分钟，并且启动时将会有 10 秒种的延时。

Charles 主要的功能包括：

1. 截取 Http 和 Https 网络数据包。
2. 支持重发网络请求，方便后端调试。
3. 支持网络请求的截获并动态修改。
4. 支持模拟慢速网络。

Charles安装

在Charles的官方网站（http://www.charlesproxy.com）下载最新版的 Charles 安装包。

打开后一路下一步安装即可，全部选择默认配置。

Charles 设置系统代理

Charles 是通过将自己设置成代理服务器来完成数据包截取的，所以使用 Charles 的第一步是将其设置成系统的代理服务器。

将 Charles 设置成系统代理时，选择菜单中的 “Proxy” –> “Windows Proxy” 来将 Charles 设置成系统代理。如下所示：

当本机产生一些网络请求时，可以在左侧看到网站的地址以及请求的结果。

Charles 主界面介绍

1. Structure 视图将网络请求按访问的域名分类。
2. Sequence 视图将网络请求按访问的时间排序。

Request表示请求的内容：

Response表示响应的内容：

当我们访问www.gyyx.cn时，request显示请求方式、地址、浏览器、接受协议、接受语言、Cookie

Response显示页面源码

可以根据具体的需要在这两种视图之间切换。Charles 提供了一个简单的 Filter 功能，可以输入关键字来快速筛选出 URL 中带指定关键字的网络请求。

过滤网络请求

通常情况下，我们需要对网络请求进行过滤，只监控向指定目录服务器上发送的请求。对于这种需求，以下几种办法：

方法一：

在主界面的中部的 Filter 栏中填入需要过滤出来的关键字。例如我们查询以gyyx.cn为服务器的地址时，那么只需要在Filter栏中填入gyyx.cn即可。

方法二：

在 Charles 的菜单栏选择 “Proxy”–>“Recording Settings”，然后选择 Include 栏，选择添加一个项目，然后填入需要监控的协议，主机地址，端口号。这样就可以只截取目标网站的数据包了。如下图所示：

设置完成后，会只显示该域名下的请求。

方法三：

在想过滤的网络请求上右击，选择 “Focus”，之后在 Filter 一栏勾选上 Focussed 一项，如下图所示：

这种方式可以临时性的，快速地过滤出一些没有通过关键字的一类网络请求。

截取手机上的网络数据包

Charles 通常用来截取本地上的网络数据包，也可以用来截取其它设备上的网络请求。下面就以Android设备为例，讲解如何进行相应操作。

要截取Android设备上的网络请求，我们首先需要将 Charles 的代理功能打开。在 Charles 的菜单栏上选择 “Proxy”–>“Proxy Settings”，填入代理端口 8888，并且勾上 “Enable transparent HTTP proxying” 就完成了在 Charles 上的设置。如下图所示:

Android设备的设置：

首先我们需要获取 Charles 运行所在电脑的 IP 地址，即本机的IP地址，通过cmd命令，输入ipcnfig进行查询。如下图所示：

在手机的 “设置”–>“WLAN”，连接一个Wifi，例如我们连接qa.dev.org，连接成功后，点击修改网络，勾选显示高级选项，将其切换成手动，然后填上 Charles 运行所在的电脑IP，以及端口号 8888，如下图所示：

在 Charles 的菜单栏上选择 “Proxy”–>“SSL Proxy Settings”，勾选” Enable SSL Proxying”，这样就可以截取到手机上的通讯信息：

如果只保存手机上的网络通讯结果，不显示电脑端的网络通讯结果的话，只需去掉Windows Proxy选项即可：

登录对应的APP成功后，我们可以看到网络请求的结果：

模拟慢速网络(弱网)

在做移动开发或者测试的的时候，常常需要模拟慢速网络或者高延迟的网络，以测试在弱网环境下，应用的表现是否正常。Charles 对此需求提供了很好的支持。

在 Charles 的菜单上，选择 “Proxy”–>“Throttle Setting” 项，在之后弹出的对话框中，勾选 “Enable Throttling”，并且可以设置 Throttle Preset 的类型。如下图所示：

如果只想模拟指定网站的慢速网络，可以勾选上图中的 “Only for selected hosts” 项，然后在对话框的下半部分设置中增加指定的 hosts 项即可。

修改网络请求内容

有些时候为了调试服务器的接口，需要反复尝试不同参数的网络请求。Charles 可以方便地提供网络请求的修改和重发功能。只需要在以往的网络请求上点击右键，选择 “Edit”，即可创建一个可编辑的网络请求。如下所示：

可以修改该请求的任何信息，包括 URL 地址、端口、参数等，之后点击 “Execute” 即可发送该修改后的网络请求（如下图所示）。

Charles 支持我们多次修改和发送该请求，这对于我们和服务器端调试接口非常方便，如下图所示：

总结：

通过 Charles 软件，我们可以很方便地在日常开发和测试中，截取和调试网络请求内容，分析封包协议以及模拟慢速网络。用好 Charles 可以极大的方便我们对于带有网络请求的 App 的开发和测试。