测试基础 Charles 从入门到精通，看这篇文章就够了

爱学习的饲养员 · 2024年09月10日 · 最后由 direction 回复于 2024年10月20日 · 7332 次阅读

大家好，Charles 是我们工作中常用的抓包工具，功能非常强大，那今天我们就介绍一下 Charles 的用法及实现原理。

简介

Charles 是在 PC 端常用的网络封包截取工具，在做软件测试/APP 开发时，我们为了调试与服务器端的网络通讯协议，常常需要截取网络封包来分析。Charles 支持抓取 HTTP 和 HTTPS 协议的网络请求和响应，也可以用于分析第三方应用的通讯协议。

Charles 实现原理

Charles 是一个代理服务器。配置好 PC 或手机网络代理后，Charles 就像一个中间人，能够捕获到从客户端发到服务器的请求，以及服务器再传递回客户端时的响应，所以我们打开 Charles 能够看到 HTTP（HTTPS）请求和响应的详细信息。

安装 Charles

访问 Charles 的官方网站（http://www.charlesproxy.com）
下载最新版的 Charles 安装包，MAC 版安装包打开后将 Charles 拖到 Application 目录下即可，Windows 版打开可执行程序安装即可

Charles 主界面

Charles 主要提供两种查看请求的视图，分别名为 “Structure” 和 “Sequence”：

Structure 视图将网络请求按访问的域名分类（推荐）
Sequence 视图将网络请求按访问的时间排序

主页面右侧上方可以看到请求详情，包括 Header，请求参数，Cookies 等信息。右侧下方展示返回结果，如果是 JSON，会自动进行格式化方便查看；如果返回的是图片，还可以显示出图片的预览效果。

Filter 功能：作用是筛选出指定的请求。

方法一：可以输入关键字来快速筛选出 URL 中带指定关键字的网络请求。
方法二：在 Charles 的菜单栏选择 “Proxy”->” Recording Settings”，然后选择 Include 栏，选择添加一个项目，然后填入需要监控的协议，主机地址，端口号。这样就可以只截取目标网站的封包

方法三（推荐）：在想过滤的网络请求上右击，选择 “Focus”。

Charles 抓包教程

PC 端抓包

启动 Charles 后，第一次 Charles 会请求你给它设置系统代理的权限。你可以输入登录密码授予 Charles 该权限。你也可以忽略该请求，然后在需要将 Charles 设置成系统代理时，选择菜单中的 “Proxy” -> “Mac OS Proxy” 来将 Charles 设置成系统代理。如下所示：

设置 Mac OS Proxy 后，可以再检查 Mac 的 WIFI 代理设置。默认情况下网页代理（HTTP）和安全网页代理（HTTPS）选项中网络代理服务器显示为 127.0.0.1 端口为 8888。

到了这一步，正常情况下，你的 PC 就可以捕获到 HTTP 请求了，若还是无法正常捕获，检查 WIFI 代理是否设置了自动代理配置，若设置了会导致无法捕获到 Chrome 和 Firefox 浏览器的请求，使用时可以先取消勾选该选项。

移动端抓包

这里的抓包教程以 iPhone 为例子，安卓操作步骤与 iPhone 一致。首先需要将 Charles 的代理功能打开。在 Charles 的菜单栏上选择 “Proxy”->” Proxy Settings”，填入代理端口 8888，并且勾上 “Enable transparent HTTP proxying” 就完成了在 Charles 上的设置。如下图所示:

获取 Charles 运行所在电脑的 IP 地址，Charles 的顶部菜单的 “Help”->” Local IP Address”，即可在弹出的对话框中看到 IP 地址，如下图所示：

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

设置好之后，我们打开 iPhone 上的任意需要网络通讯的程序（如手机上百度 APP），就可以看到 Charles 弹出 iPhone 请求连接的确认菜单（如下图所示），点击 “Allow” 即可完成设置。现在就可以进行 HTTP 抓包了，如果还想再进行 HTTPS 抓包，需要安装和信任对应的证书。

HTTPS 抓包

上面 PC 端与移动端抓包步骤设置好以后，Charles 就可以正常捕获 HTTP 请求了，但是现在还无法解析 HTTPS 请求。如果还想解析 HTTPS 请求，需要在 PC 端和手机端安装证书。
（1）PC 端安装证书
点击 Charles 的顶部菜单，选择 “Help” -> “SSL Proxying” -> “Install Charles Root Certificate”，然后输入系统的帐号密码，即可在 KeyChain 看到添加好的证书。如下图所示：

然后再进行信任证书，在 Mac 上的 “钥匙串访问” App 中，选择其中一个钥匙串列表中的钥匙串，然后连按一个证书，设置 Charles 的证书为始终信任：

完成以上步骤，你的 MAC 就可以正常抓取和解析 HTTPS 协议了。
证书过期处理方式，当我们使用 Charles 超过两年以上，Charles Root 证书过期，可以通过下方这种方式重置并重新安装证书。

（2）移动端安装证书点击 Charles 的顶部菜单，选择 “Help” -> “SSL Proxying” -> “Install Charles Root Certificate on a Mobile Device or Remote Browser”

弹出提示框，上面有代理的 IP 与端口，以及下载证书的地址：

拿出手机，以安卓为例子。打开 WIFI 将代理调整为手动，然后输入 charles 弹出来的主机 ip，再将端口号输入：8888

下载证书：点击确认后 Charles 会出现连接是否允许的选项，点击 allow，然后就可以在手机浏览器输入 chls.pro/ssl 下载证书。
安装与信任证书：安卓手机（华为）安装证书的方式【设置 - 安全 - 更多安全设置 - 加密和凭据 - 从存储设备安装 - 证书的路径】注意：证书用途一定要选择 VPN 和应用，不然华为手机无法信任用户安装的证书。 IOS 信任证书的方式【设置 - 通用 - 关于本机 - 证书信任设置】

Charles 常用功能

重复请求

在测试过程中，有时候需要对服务器重复相同发送请求，用于定位服务器问题或者压力测试，在请求上双击右键菜单，点击 Repeat 按钮就可以重复发送请求：

点击 Repeat Advanced... ，还可以设置重复发送的次数，是否多线程发送，以及每次发送的时间间隔

模拟弱网

在做软件测试的时候，我们常常需要模拟慢速网络或者高延迟的网络，以测试在弱网下，APP 的各个功能是否正常使用，以及是否有对应的网络提示。
在 Charles 的菜单上，选择 “Proxy”->” Throttle Setting” 项，在之后弹出的对话框中，我们可以勾选上 “Enable Throttling”，并且可以设置 Throttle Preset 的类型，可以模拟 3G 或者其他指定 kbps 的网络，设置下载和上传的速率。如下图所示：

修改请求和响应

在测试时，我们时常会重定向请求的地址，以及修改请求或者响应的内容。Charles 提供了 MAP、Rewrite、Breakpoints 三大功能来实现

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

MAP

Map 功能分为 Map Remote 和 Map Local。Map Remote 是将指定的网络请求重定向到另一个网址请求地址，Map Local 是将响应的内容重定向到本地文件
在 Charles 的菜单中，选择 “Tools”->” Map Remote” 或 “Map Local” 即可进入到相应功能的设置页面：

对于 Map Remote 功能，分别填写网络重定向的源地址和目的地址，对于不需要限制的条件，可以留空。下图是一个示例，我将所有 baidu.baidu.com（线上地址）的请求重定向到了 11.102.135.33:8505（线下测试地址）

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

将一个指定的网络请求通过 Map Local 功能映射到了本地的一个经过修改的文件中，图中的 Map From 就是源请求地址，而 Map To 就是本地的返回结果文件。

Map Local 在使用的时候，有一个潜在的问题，就是其返回的 HTTP Response Header 与正常的请求并不一样。这个时候如果客户端校验了 HTTP Response Header 中的部分内容，就会使得该功能失效。解决办法是同时使用 Map Local 以下面提到的 Rewrite 功能，将相关的 HTTP 头 Rewrite 成我们希望的内容。

在测试时，我们通常有线上和线下两套环境，而我们的 APP 直接打开是请求的线上环境，这时候就需要通过 Charles 的 Map Remote 功能，实现重定向请求到线下环境进行测试。也可以使用 Map Local 来修改响应结果。

Rewrite

修改请求或者返回结果 Body 或者 Header 内容，支持正则表达式：

Rewrite 还可以和 Map Remote 配合使用。即先重定向地址，然后修改请求头或返回结果等，注意如果需要在 Map Remote 勾选 Preserve host in header fields，不然 Rewrite 无法命中。

Breakpoints

上面提供的 Rewrite 功能最适合做批量和长期的替换，如果只是想临时替换一次，可以 Breakpoints 功能。

Breakpoints 功能类似我们在 Xcode 中设置的断点一样，当指定的网络请求发生时，Charles 会截获该请求。勾选 Breakpoints 后，可以点击 repeat，打开断点调试面板后，点击 add 临时修改网络请求的请求/返回内容，然后点击 Execute 执行即可。