Charles 抓包工具：跨端刚需的 90% 高频使用指南

Windows 开发者可能最先想到 Fiddler，但 Charles 才是 Win/Mac/Linux 全平台通吃、界面清爽不臃肿、覆盖 Web 端 + 移动端全调试场景 的「网络排雷万金油」——前端改接口不用切环境、移动端测异常不用改代码发包、后端查参数串改不用翻设备日志。

本文避开花里胡哨的小众功能，只讲 10 分钟能搭好环境、日常开发测试必用的核心配置与技巧，看完你就能直接上手解决问题。

一、基础配置检查：先搭「能走的路」

刚安装打开 Charles，别急着折腾 SSL 证书或手机，先确认 2 个默认基石配置，避免后期踩坑。

1.1 HTTP 代理端口

Charles 默认会开启 HTTP/HTTPS 流量的监听端口，只要没冲突，不用改默认值：

// 推荐「开箱即用」配置（默认就是这个！）
{
  "http_proxy_port": 8888,   // 所有设备流量统一走的入口端口
  "socks_proxy_port": 9999,  // 仅抓非HTTP流量（如FTP早期版本）时用
  "enable_automatic_config": false // 手动配置设备代理更稳定
}

👉 查看 / 修改路径：顶部菜单栏 → Proxy → Proxy Settings → Proxies 标签页

二、HTTPS 解密配置：Charles 的「灵魂」

没解密的 HTTPS 流量，在 Charles 里全是灰绿色的乱码二进制流，什么接口、参数、响应都看不到——这一步是必须的「硬配置」。

2.1 Charles 端（PC）操作

① 开启全局 / 指定 SSL 代理

抓生产环境要注意隐私（只抓核心接口），测试 / 学习环境可以用通配符抓所有：

// 实用场景的 2 种核心配置
// 场景1：学习 / 全量测试（通配符抓所有）
{
  "enable_ssl_proxying": true,
  "locations": ["*:*"]
}

// 场景2：生产排查 / 隐私敏感（只抓指定域名）
{
  "enable_ssl_proxying": true,
  "locations": [
    "api.example.com:443", // 生产单接口
    "test.xxx.cn:*"         // 测试环境全端口
  ]
}

👉 查看 / 修改路径：顶部菜单栏 → Proxy → SSL Proxying Settings

② 安装并信任 Charles 根证书（本地）

解密的原理是「中间人劫持 → Charles 签发子证书 → 本地信任 Charles 根证书」，所以必须让 PC 和调试设备都信任它：

MacOS：Help → SSL Proxying → Install Charles Root Certificate → 打开「钥匙串访问」→ 搜索 Charles Proxy CA → 右键 → 显示简介 → 信任 → 把「使用此证书时」改成「始终信任」
Windows：Help → SSL Proxying → Install Charles Root Certificate → 选「本地计算机」→ 下一步 → 将所有证书放入下列存储 → 浏览 → 受信任的根证书颁发机构 → 确定 → 完成
Linux（Ubuntu）：Help → SSL Proxying → Save Charles Root Certificate → 存为 .pem → 移动到 /usr/local/share/ca-certificates/ → 执行 sudo update-ca-certificates

2.2 调试设备端（手机 / 平板）操作

⚠️ 核心前提：手机和 Charles 的 PC 必须在同一个无隔离的局域网（比如都连家里 / 公司的同个 WiFi，不能连员工 WiFi + 内部专线这种组合）

Android 设备通用步骤

⚠️ Android 7.0（API 24）+ 的坑：默认不信任用户安装的证书！如果是自己写的测试 App，要在 res/xml/network_security_config.xml 里加信任配置；如果是浏览器 / 第三方公开 App，部分厂商（小米、OPPO 等）可能需要手动开启「信任用户证书用于 VPN 和应用」。

查 PC 局域网 IP：Mac 用 ifconfig 找 en0（WiFi）下的 inet；Windows 用 ipconfig 找「无线局域网适配器 WLAN」下的「IPv4 地址」
配手机 WiFi 代理：长按已连 WiFi → 修改网络 → 高级选项 → 代理手动 → 填 PC IP 和 8888 端口 → 保存
装手机端根证书：手机浏览器访问 chls.pro/ssl → 下载证书 → 按提示安装（Android 11+ 选「CA 证书」）

iOS 设备通用步骤

iOS 的信任步骤比 Android 多一步，但更统一规范：

同 Android 的「查 IP → 配 WiFi 代理」
装描述文件：Safari 访问 chls.pro/ssl → 下载 → 允许 → iPhone → 关闭
激活并信任证书（这一步必做！）：
- 激活：设置 → 通用 → VPN 与设备管理 → 找到 Charles Proxy CA → 安装 → 输锁屏密码
- 全局信任：设置 → 通用 → 关于本机 → 滑到底找 证书信任设置 → 打开 Charles Proxy CA 的开关 → 点 继续

三、90% 高频功能：学会就能排雷

环境搭好后，这几个功能是每天都会用到的，熟练掌握就能解决大部分网络问题。

3.1 流量过滤：别被无关流量淹没

Charles 默认抓所有流量——手机一开微信 / 浏览器，左侧列表瞬间飘成瀑布流，这时候必须过滤。

临时搜索过滤

最简单的方式，直接在 Charles 主界面顶部的白色「Filter」搜索栏输入关键词：

可以搜域名（如 api.example）
可以搜接口路径（如 /user/info）
可以搜请求 / 响应参数值（如 id=123）
支持模糊匹配，实时生效

永久 Focus 过滤

如果只关注固定几个域名，可以把它们设为「核心聚焦」：

在左侧 「Structure」树形视图下，右键点击目标域名
选择「Focus」
其他未聚焦的域名会自动折叠到下方的「Other Hosts」灰色文件夹里，完全不干扰视线

3.2 断点调试：实时篡改请求 / 响应

断点调试是 Charles 最「硬核」的实用功能——不用改一行代码、不用重启服务、不用重新打包，就能测试各种边界场景：

配置断点的 2 种方式

临时单条请求断点：最快的调试方式
- 在「Structure」或「Sequence」时序视图下，找到已抓取的目标请求
- 右键 → 选「Breakpoints」
- 重新发起该请求，就会被 Charles 拦截

批量规则断点：适合拦截同类型的所有请求

👉 路径：Proxy → Breakpoints Settings → 勾选「Enable Breakpoints」 → 点击「Add」

# 批量规则示例：拦截所有 /api/ 开头的请求，改完请求改响应
Protocol: HTTP/HTTPS
Host: *                # 所有域名，可填具体的
Port: *                # 所有端口，可填443
Path: */api/*          # 拦截路径包含 /api/ 的
Query: *               # 所有查询参数，可填id=123
Request: ✅             # 改请求阶段（参数/Header/Body）
Response: ✅            # 改响应阶段（状态码/Header/Body）

断点调试的流程

符合规则的请求发起后，Charles 会自动弹出「Breakpoints」窗口：

Edit Request：修改你想改的内容（比如把 userId=1 改成 userId=999 测试管理员权限，把 Header 里的 token 删掉测试未登录）→ 改完点「Execute」
Edit Response：等服务返回原始响应后，修改你想改的内容（比如把状态码改成 500 测试后端挂了的情况，把响应里的 userName 改成「测试异常值」）→ 改完点「Execute」，修改后的内容就会返回给客户端

3.3 映射设置：线上 / 测试环境一键切换

映射设置可以把线上的请求完全透明地转发到本地、测试环境，甚至另一个线上接口——不用改前端代码里的接口地址，不用重新打包 App，非常高效。

Map Remote（远程地址映射）

最常用的映射方式，比如把线上 https://api.example.com/v1/user 映射到本地开发服务 http://192.168.1.100:3000/dev/user：

👉 路径：Tools → Map Remote → 勾选「Enable Map Remote」 → 点击「Add」

# Map Remote 规则示例
# 【Source】原始线上请求
Protocol: HTTPS
Host: api.example.com
Port: 443
Path: /v1/user
Query: *

# 【Destination】映射后的目标请求
Protocol: HTTP
Host: 192.168.1.100
Port: 3000
Path: /dev/user
Query: *  # 可选「Remove」去掉原始参数，或「Append」追加新的

Map Local（本地文件映射）

适合测试固定的异常响应场景（比如接口返回空数组、返回超长字符串、返回错误状态码）：

👉 路径：Tools → Map Local → 勾选「Enable Map Local」 → 点击「Add」

配置和 Map Remote 几乎一样，只是「Destination」不需要填远程地址，直接选本地的 JSON/HTML/TXT 文件即可。

总结

Charles 的配置看起来有几步，但都是「一次配置，长期使用」的内容——今天花 10 分钟把端口、SSL 证书、过滤 / 映射规则搭好，以后遇到网络问题就能快速定位和解决。

如果有更高级的需求（比如 WebSocket 抓包、限流模拟、请求重发批量测试），可以后续再探索，但本文的内容已经足够应付日常开发测试的 90% 场景啦！

#Charles 抓包工具：跨端刚需的 90% 高频使用指南

#一、基础配置检查：先搭「能走的路」

#1.1 HTTP 代理端口

#二、HTTPS 解密配置：Charles 的「灵魂」

#2.1 Charles 端（PC）操作

#① 开启全局 / 指定 SSL 代理

#② 安装并信任 Charles 根证书（本地）

#2.2 调试设备端（手机 / 平板）操作

#Android 设备通用步骤

#iOS 设备通用步骤

#三、90% 高频功能：学会就能排雷

#3.1 流量过滤：别被无关流量淹没

#临时搜索过滤

#永久 Focus 过滤

#3.2 断点调试：实时篡改请求 / 响应

#配置断点的 2 种方式

#断点调试的流程

#3.3 映射设置：线上 / 测试环境一键切换

#Map Remote（远程地址映射）

#Map Local（本地文件映射）

#总结