Charles 介绍

简介

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

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

Charles 主要功能

将 Charles 设置为系统代理

Charles 是通过将自己设置成代理服务器来完成封包截取的，所以使用 Charles 的第一步是将其设置成系统的代理服务器。具体操作如下：

需要注意的是，Chrome 和 Firefox 浏览器默认并不使用系统的代理服务器设置，而 Charles 是通过将自己设置成代理服务器来完成封包截取的，所以在默认情况下无法截取 Chrome 和 Firefox 浏览器的网络通讯内容。如果需要截取的话，在 Chrome 中设置成使用系统的代理服务器设置即可，或者直接将代理服务器设置成 127.0.0.1:8888 也可达到相同效果。

过滤网络请求

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

1、在主界面的中部的 Filter 栏中填入需要过滤出来的关键字。例如我们的服务器的地址是：http://baidu.com , 那么只需要在 Filter 栏中填入 baidu 即可

2、选择 “Proxy”–>“Recording Settings”，然后选择 Include 栏，选择添加一个项目，然后填入需要监控的协议，主机地址，端口号。这样就可以只截取目标网站的封包了

3、在想要过滤的网络请求上右击，选择“Foucs”，之后在 Filter 一栏勾选上 Focussed 一项

通常情况下，我们使用方法一做一些临时性的封包过滤，使用方法二做一些经常性的封包过滤

截取 iPhone 网络封包

Charles 通常用来截取本地上的网络封包，但是当我们需要时，我们也可以用来截取其它设备上的网络请求。 确保抓包电脑和手机在同一网络中，不然是抓取不到网络包。

1、Charles 上的设置

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

2、iPhone 上的设置

需要获取 Charles 运行所在电脑的 IP 地址，Charles 的顶部菜单的 “Help”–>“Local IP Address”，即可在弹出的对话框中看到 IP 地址

然后在 iPhone 的 “ 设置 ”–>“ 无线局域网 ” 中，可以看到当前连接的 wifi 名，通过点击右边的详情键，可以看到当前连接上的 wifi 的详细信息，包括 IP 地址，子网掩码等信息。在其最底部有「HTTP 代理」一项，我们将其切换成手动，然后填上 Charles 运行所在的电脑的 IP，以及端口号 8888

截取 Https

安装证书

如果需要截取 Https 协议相关的内容，那么就需要安装 Charles 的 CA 证书

出现弹窗得到地址：http://charlesproxy.com/getssl

在手机浏览器输入 http://charlesproxy.com/getssl 地址，会出现安装证书页面，点击安装即可

Charles 设置 Proxy

Proxy -> SSL Proxying Settings…勾选Enable SSL Proxying，点击Add

Host设置要抓取的https接口，比如想抓：https://www.baidu.com （当 Host 为*，默认抓取全部https请求）

弱网测试

在做移动开发时，尝尝需要模拟慢速网络或者高延迟网络，以测试在移动网络下应用是否表现正常

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

Bandwidth（带宽）【吞吐量】：指定上载和下载链接的不同带宽限制
Utilisation（利用率）：利用率是总带宽的百分比，它只是作为可用带宽的缩放比率，对于大多数现代互联网连接利用率始终是 100%
Round-tripLatency（请求往返延迟）【延时】：往返延迟测量客户端和远程服务器之间往返通信的毫秒延迟
MTU（最大传输单元）：在任何传输的 TCP 数据包的最大尺寸
Reliability（可靠性）【丢包】：可靠性是衡量连接完全失败的可能性，这是非常有用的模拟不可靠的网络条件
Stability（稳定性）【抖动】：稳定性是衡量一个连接的可能性是不稳定的，因此降低了质量。这是非常有用的模拟网络，如移动网络，定期连接质量差。如果连接不稳定，则连接的质量会在不稳定的质量范围内随机下降
unstablequalityrange（不稳定质量范围）：此处设置主要针对于 Stability 中设置中的范围

修改网络请求内容

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

给服务器做压力测试

可以使用 Charles 的 Repeat 功能来简单地测试服务器的并发处理能力：在想打压的网络请求上（POST 或 GET 请求均可）右击，然后选择「Repeat Advanced」菜单项

接着就可以在弹出的对话框中，选择打压的并发线程数以及打压次数，确定之后，即可开始打压

修改服务器返回内容

有些时候我们想让服务器返回一些指定的内容，方便我们调试一些特殊情况，例如列表页面为空的情况，数据异常的情况，部分耗时的网络请求超时的情况等。如果没有 Charles，要服务器配合构造相应的数据显得会比较麻烦。这个时候，使用 Charles 相关的功能就可以满足我们的需求。

根据具体的需求，Charles 提供了 Map 功能、Rewrite 功能以及 Breakpoints 功能，都可以达到修改服务器返回内容的目的。这三者在功能上的差异是：

Map 功能适合长期地将某一些请求重定向到另一个网络地址或本地文件
Rewrite 功能适合对网络请求进行一些正则替换
Breakpoints 功能适合做一些临时性的修改

Map

Charles 的 Map 功能分 Map Remote 和 Map Local 两种：

Map Remote 是将指定的网络请求重定向到另一个网址请求地址
Map Local 是将指定的网络请求重定向到本地文件

在 Charles 的菜单中，选择 “Tools”–>“Map Remote” 或 “Map Local” 即可进入到相应功能的设置页面

Map Remote：需要分别填写网络重定向的源地址和目的地址，对于不需要限制的条件，可以留空。下图示例将所有ytk1.yuanku.ws（测试服务器）的请求重定向到了www.yuantiku.com（线上服务器）

Map Local：需要填写的重定向的源地址和本地的目标文件。对于有一些复杂的网络请求结果，我们可以先使用 Charles 提供的 “Save Response…” 功能，将请求结果保存到本地（如下图所示），然后稍加修改，成为我们的目标映射文件

Rewrite

Rewrite 功能适合对某一类网络请求进行一些正则替换，以达到修改结果的目的，可以重写接口所有元素的内容：header、host、url、path、query param、response status、body，具体操作如下：

1、点击 Charles 菜单栏 Tools 中的 Rewrite，弹出Rewrite Settings框，勾选左上角的Enable Rewrite选项，并点击Add，左侧边框出现Untitled Set，在右侧的Name栏可以对此次的Rewrite进行重命名

2、在右侧Location栏点击Add，在弹出的Edit Location对话框中，填入相关参数，最后点击OK

3、接着，在右侧 Rules 栏点击 Add，在弹出的 Rewrite Rule 对话框中，填入相关参数，最后点击 OK

以下为使用 Charles 修改接口内容的具体使用：

1、修改接口返回报文参数

作用：对请求的响应内容做修改，一般是对某一个或几个值进行 rewrite，用新的值来替代返回的值。

使用场景：可以用来 mock 数据，比方说在开发中为了测试功能需要请求的某个数组字段有值，但是当前环境无法给出，那么就可以使用该功能

上图操作会将返回数据中的 2018-08-05 全部替换成 2018-08-03

2、修改请求的 header

作用：可以对请求或者响应的 header 内容进行操作，包括添加、修改及删除

使用场景：在需要对 header 进行处理时用到，例如为了用上某个环境数据，可能需要对应 userid，这时本地开发是可以在请求的 header 中加上 userid 信息；也可以重写响应header的信息

上图操作会在请求的header中添加userid属性

3、修改 path

path 内容使用指定 rewrite 规则的 path 来响应指定的请求 path，它可以对 path 进行裁剪

请求的结果如下：

4、其他

host: 主要是对请求进行host修改，以达到本地请求获取指定host环境中的数据，常见于mock数据
url: 修改url中某些部分，可以用别的url进行替换或者url裁剪时间戳或者md5等；场景使用非常多，既可以对host也可以对path进行rewrite，可以满足指定host下的请求重定向到其他host下对应path下
query param：可以对param进行操作，包括修改、添加、删除等；有时请求可能多传递了不必要的参数，这时可以rewirte功能去掉多余的参数；另外也可以添加请求必须而暂时无法提供的参数
response status：很少用到，顾名思义就是对response的状态码进行rewrite

Breakpoints

测试过程中经常需要测试不同的界面显示，比如名字太长、特殊符号显示，一方面可以通过修改源数据实现，比如数据库中修改电影名，但是这样的话首先比较麻烦，需要进行数据库操作；其次，修改完之后会影响其他人的工作。比较轻便的做法，则是通过charles修改服务器返回值实现

需要注意的是，使用 Breakpoints 功能将网络请求截获并修改的过程中，整个网络请求的计时不会暂停，所以长时间的暂停是有可能导致客户端的请求超时问题

[!example] 现在，假设有这样一个测试需求：测试豆瓣电影名显示

1、打开 Charles，勾选 Proxy，网页请求 https://movie.douban.com/

2、找到热门电影接口，单击右键选中“Breakpoints”

3、再次请求该页面，该页面刷新后，热门电影区域显示空白，charles 首先弹出“请求”选择框，有 “Cancel”、“Abort”、“Execute” 三个选择，选择 “Execute”，让 charles 通过这次请求。Cancel 表示取消，Abort 表示中止，Execute 表示执行

4、接下来会触发 “响应” 选择框，点击 “Edit Response”，修改返回值，点击 “Execute”