526互联

Charles 使用手册

发布时间 2023-03-24 16:04:53作者: ABEELAN

抓取 PC 端请求

HTTP 请求

默认抓取pc端http请求（可在 Proxy - Windows Proxy 勾选抓取/不勾选不抓取）

HTTPS 请求

  1. 选择 Help->SSL Proxying->Install Charles Root Certificate，下载安装证书
    image
  2. 点击安装证书，然后一路下一步，显示导入成功，点击确定。
    image

此时去IE浏览器 工具栏 - internet选项 - 内容 - 证书 - 受信任的根证书颁发机构下找到Charles Proxy证书为成功。 如下图：
image

如找不到，则在中级证书颁发机构导出，受信任的根证书颁发机构导入。


抓取移动端请求

设置 Charles

要截取手机上的网络请求，首先需要将 Charles 的代理功能打开。

  1. 在Charles的菜单栏上选择 “Proxy”->“Proxy Setting”
  2. 填入代理端口 8888（默认）并且勾选 “Enable transparent HTTP proxying” 就完成了再Charles上的设置。

手机设置

iPhone设置抓取 HTTP

  1. 获取Charles运行所在电脑的IP地址：
    Charles的顶部菜单的 Help->Local IP Address，即可在弹出的对话框中看到IP地址。

  2. 在iPhone的 设置->无限局域网中，找到当前链接的 WiFi，点击右边的详情键，进入WiFi详细信息，包括IP地址，子网掩码等信息。在其最底部有【HTTP代理】一项，将其切换成手动，然后填上Charles运行所在的电脑IP，以及端口 8888。

  3. 设置好之后，打开 iPhone 上的任意需要网络通讯的程序，就可以看到 Charles 弹出 iPhone请求连接的确认菜单，点击“allow”即可完成设置。

Android 设置抓取 HTTP

在手机的设置->WLAN中，找到当前连接的WiFi名称：

  1. 长按连接的WiFi或者点击连接的WiFi
  2. 打开高级选项或者滑动到底部代理处
  3. 在代理一栏选择手动
  4. 代理服务器主机名填写电脑的IP地址
  5. 代理服务器端口填写Charles设置的端口号：8888
  6. 点击【保存】/【确定】后即可
  7. 打开手机上的任意需要网络通讯的程序，就可以看到 Charles 弹出 iPhone 请求连接的确认菜单，点击“allow”即可完成设置。

iphone/Android 抓取 HTTPS

  1. 选择 Help -> SSL Proxying -> Install Charles Root Certificate on a Mobile Device or Remote Browser，弹框点击确定；

  2. Android/iphone手机浏览器访问地址：chls.pro/ssl, 根据提示下载安装ca证书;

  3. 安装完成后，点击Proxy -> SSL Proxy Settings -> SSL Proxy->勾选 Enable SSL Proxying
    Add添加要抓取的站点、端口号（*代表任意的站点）

  4. 再次抓取，即可成功（Andorid 7.0 以上无法抓取，需要客户端修改配置文件）
    如何修改？

Map 功能

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

Map Local

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

下图是一个示例，将一个指定的网络请求通过Map Local 功能映射到了本地的一个经过修改的文件中，分两步进行介绍:

  1. 首先选中某个请求（eg:status_control.m）右键，选择Map Local，出现如图所示：
    image

  2. 将修改后的文件，导入Charles中，如下图：
    image

  3. 重新刷新页面，就可以看到调试的那个文件其实是从本地加载的。

Map Remote

Map Remote 功能，需要分别填写网络重定向的源地址和目的地址，对于不需要限制的条件，可以留空。

  1. 首先选中某个请求（eg: a.com）右键，选择 Map Remote，表示匹配 a.com 下的所有文件，将其重定向到 b.com 下;

  2. 上面的配置通过 map Remote 就是实现了区别对待本地系统的不同请求，将指定路径下的请求重定向到指定的环境。

Rewrite

Rewrite功能重写对应的内容，主要可以对某些匹配请求的 header、host、url、path、query param、response status、body进行 rewrite。
Rewrite规则简单说明，指出对应的作用及其使用场景。
Header

  • 作用：可以对请求或者响应的 header 内容进行操作，包括添加、修改及删除
  • 使用场景：在需要对header进行处理时用到，例如为了用上某个环境数据，可能需要对应cookie，这时本地开发是可以在请求的header中加上cooker信息；也可以重写响应header的信息

Host

  • 主要是对请求就行host修改，以达到本地请求获取指定host环境中的数据，常见于mock数据

url

  • 作用：修改url中某些部分，可以用别的url进行替换或者url裁剪时间戳或者md5等
  • 使用场景：场景使用非常多，既可以对host也可以对path进行rewrite，可以满足指定host下的请求重定向到其他host对应的path下

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

query param

  • 作用：可以对param进行操作，包括修改、添加、删除等
  • 使用场景：有时请求可能多传递了不必要的参数，这时可以rewrite功能去掉多余的参数；另外也可以添加请求必须而暂时无法提供的参数

response status

  • 很少用到，就是对response的状态码进行rewrite

Body

  • 作用：对请求的相应内容做修改，一般是对某一个或几个值进行rewrite，用新的值来替代返回的值
  • 使用场景：可以用来mock数据，比如说在开发中为了测试功能需要请求的某个数组字段有值，但是当前环境无法给出，就可以使用该功能

  1. 选择 Tools->Rewrite，在弹出的对话框中勾选 Enable Rewrite 启用 rewrite 功能。点击左侧Sets 中的 Add 按钮，添加一条 Rewrite 规则，可以设置一个名字；

  2. 点击右侧 Location 中的 Add，可以全部留空匹配所有请求，也可以根据要过滤的指定接口，然后点击OK确认；

  3. 点击 Rules 中的 Add 按钮，添加一条规则，弹出窗口设置如下：
    修改 Response Header 匹配 Content-Type=text/plain 的项，并将其替换成
    Content-Type=application/json;charset=UTF-8（根据实际情况进行设置），点击ok保存;

  4. 再次使用MapLocal功能时，发现乱码问题已经解决了（前提是所映射的本地文件也是UTF-8编码，通常在Mac系统中，默认支持的中文编码就是UTF-8）

Throttle（模拟慢网速请求）

选择 Proxy-> Throtting setting，打开后如下图设置：（如果要针对某一个地址限速，在Hosts里可以add要限速的url）
image

在工具栏点击图标，即可直接开启模拟慢速网络。

Breakpoints

对于只是想临时修改一次网络请求结果，这个时候，使用 Rewrite 功能虽然也可以达到目的，但是过于麻烦，对于临时性的修改，最好使用 Breakpoints 功能。

Breakpoints 功能类似我们在 Xcode 中设置的断点一样，当指定的网络请求发生时，Charles 会截获该请求，这个时候，我们可以在 Charles 中临时修改网络请求的返回内容。

  1. 找到需要进行断点设置的请求（在请求的父目录打断点），如下图：
    image

  2. 查看未修改前，手机上对应请求的界面显示

  3. 再次进入手机这个界面，会通过刚从打断点的域名来请求数据，就会被断点拦住，如下图：
    image

  4. 可以编辑请求，点击执行，如果响应也打了断点，则响应回来了也可以编辑响应；

  5. 编辑完成后，点击执行，即可看到客户端展示断点设置的内容。

简单的压力并发

右键请求 - Repeat Advanced 设置并发线程数及打压次数，设置完毕，点击 ok
image