Charles 网络抓包工具详解与实战指南

538 阅读4分钟

导读

  • 了解网络抓包工具 Charles 的基本原理和核心功能,以及常用功能的使用案例。

软件版本

  • Charles 4.6.4

Charles

  • Charles 是在 PC 端常用的网络包抓取工具,移动端开发者可能接触更多,Web 端使用浏览器开发工具或者 Postman 已经基本可以满足我们开发中的需求,但 Charles 作为一款热门的网络包抓取工具,具备一些高级特性,比如请求重发、请求断点、网速截流、DNS欺骗、动态请求重写、请求名单限制等等,在某些场景能够帮助我们进行更加高效的完成开发工作。

基本原理

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

DM_20230721175927_001.png

核心功能

  • HTTP & HTTPS 网络包抓取(PC端、Web端、手机端)
  • 网络请求修改、动态修改、重发、规则重发等
  • DNS欺骗、网速模拟,支持请求白名单黑名单等。
  • 支持 Mac、Win、Linux。

下载及安装

界面介绍

DM_20230721175935_001.png

网络包展示

  • Charles 主要提供两种查看网络包的视图,分别名为 Structure 和 Sequence。
Structure: 此视图将网络请求按访问的域名分类。
Sequence: 此视图将网络请求按访问的时间排序。

常用场景介绍

  • Charles 的功能很多,本文主要介绍一些常用的使用场景。

PC 端网络抓包

  • 勾选 Proxy | Windows Proxy
  • 开启 Charles 处于 Start Recording 状态
  • 上述操作完成后,打开浏览器访问,你会发现网络请求并没有被抓取,这是因为还没有配置浏览器的代理,Charles 启动的代理服务器如下图所示,你可以在 windows 设置中进行配置,也可以使用浏览器插件进行配置,本文演示使用 Chrome 代理插件 SwitchyOmega 配置:

DM_20230721180030_001.png

DM_20230721180057_001.png

移动端网络抓包

PC 端配置

  • 开启 Charles 代理功能,代理配置 Enable transparent HTTP proxying
  • 开启 Charles 处于 Start Recording 状态

DM_20230721180057_001.png

手机端配置

  • 通过 Charles 的主菜单 Help | Local IP Address 或者通过命令行工具输入 ipconfig 查看本机的 IP 地址。
  • 打开手机端的 WIFI 代理设置,输入PC IP 和 Charles 的代理端口。
  • 完成上述步骤,打开手机浏览器发起请求,看到 Charles 弹出手机请求连接的确认,点击 Allow,Charles 就可以抓取网络请求了。

开启 SSL 代理

  • 上述步骤全部完成后,点击发起一个请求,发现请求内容是乱码的,其实这是因为没有开启 SSL 代理,这是为什么呢?
解答:猜测 + 理解不一定完全正确
这是因为没有开启 SSL 代理时,Charles 只是单纯的转发了客户端和服务端的请求,无法解密客户端和服务端建立 SSL 的通信内容。
开启 SSL 后,Charles 和客户端、服务端分别建立了 SSL 链接,并可以解密通信的内容。
因此,开启 SSL 代理后需要 Charles 生成 CA 证书并安装。

DM_20230721180203_001.png

PC 端和移动端 CA 证书安装

Charles 直接安装
  • 电脑端安装 Charles 证书:通过 Charles 的主菜单 Help | SSL Proxying | Install Charles Root Certificate 安装证书。 设置 SSL 代理:通过主菜单打开 Proxy | SSL Proxy Settings 弹窗,勾选 Enable SSL proxying。
  • 移动端安装 Charles 证书:通过 Charles 的主菜单 Help | SSL Proxying | Install Charles Root Certificate on a Mobile Device or Remote Browser 安装证书。
Charles 下载 CA 文件手动安装
  • Help | SSL Proxying | save Charles Root Certificate(移动端选择.pem、PC端选择.crt)

DM_20230721180211_001.png

  • 上述功能都配置完成后,就可以看到如上述的正常的请求,愉快的进行 debug 。

其它常用操作

请求重发

DM_20230721180217_001.png

请求改写、动态改写

  • 请求改写

DM_20230721180222_001.png

断点(Breakpoint Settings)

DM_20230721180228_001.png

DM_20230721180234_001.png

DNS 欺骗(DNS Spoofing)

  • 当通过 Charles 解析 DNS 时,将使用我们配置的 DNS 进行解析。

节流 Throttle Settings(网速模拟)

  • 模拟上下行网速。

DM_20230721180242_001.png

更多功能