Charles 是目前最主流的网络调试工具（Charles、Fiddler、Wireshark...）之一，对于一个开发者来说与网络打交道是日常需求，因此很多时候我们需要调试参数、返回的数据结构、查看网络请求的各种头信息、协议、响应时间等等。所以了解 Charles 并使用它
Charles 通过将自己设置为系统的网络访问代理服务器，这样所有的网络请求都会通过它，从而实现了网路请求的截获和分析。
Chareles 不仅可以分析电脑本机的网络请求（HTTP 和 HTTPS），还可以分析移动端设备的网络请求。
1、主导航栏介绍：
Proxy 菜单包含以下功能：
- Start/Stop Recording：开始/停止记录会话。
- Start/Stop Throttling：开始/停止节流。
- Enable/Disable Breakpoints：开启/关闭断点模式。
- Recording Settings：记录会话设置。
- Throttle Settings：节流设置。
- Breakpoint Settings：断点设置。
- Reverse Proxies Settings：反向代理设置。
- Port Forwarding Settings：端口转发。
- Windows Proxy：记录计算机上的所有请求。
- Proxy Settings：代理设置。
- SSL Proxying Settings：SSL 代理设置。
- Access Control Settings：访问控制设置。
- External Proxy Settings：外部代理设置。
- Web Interface Settings：Web 界面设置。
2、HTTP - PC简单抓包：
- 打开Charles，勾选Proxy下的macOS Proxy（如果是windows，此处为Windows Proxy）
- 点击Proxy->Start Recording，打开浏览器访问任意页面，可以在Charles中看到请求了。
1.在Charles中的Filter中可进行条件过滤
2.可通过Proxy->Recording Settings->include中配置过滤条件
3、移动端开发调试：
使手机和电脑在一个局域网内，不一定非要是一个 IP 段，只要是在同一个路由器下即可；
打开 Charles 的代理功能：通过主菜单打开 Proxy | Proxy Settings 弹窗，填入代理端口(端口默认为 8888，不用修改)，勾选 Enable transparent HTTP proxying。
如果不需要抓取电脑上的请求，可以取消勾选 Proxy | Windows Proxy 和 Proxy | Mozilla FireFox Proxy。
IOS 代理配置：
- 设置 — 无线局域网
- 点击已连接的无线网络名称
- 在http代理的配置代理中选择 “手动”
- 输入服务器IP地址及端点，点击“存储”
注意调试链接时，Charles会弹出授权窗口，要选择allow！
Android 代理配置：
- 设置 — WLAN
- 长按已连接的无线网络名称，点击修改网络
- 勾选“显示高级选项”
- 在代理选择项中选择“手动”
- 输入服务器IP端口及端口，点击存储
4、HTTPS抓包配置：
- PC安装证书：Charles主菜单 Help — SSL Proxying — install Charles Root Certificate
- 证书设置为始终信任
- 设置 SSL 代理：通过主菜单打开 Proxy — SSL Proxy Settings，勾选 Enable SSL proxying
- port设置为443
5、流量测试配置-弱网测试：
- proxy — throttle setting ，在打开的窗口勾选☑️ enable throttling
- 在throttle preset中选择对应的网络类型
Throttle Settings 视图中的选项含义如下：
- Bandwidth：带宽
- Utilistation：利用百分比
- Round-trip：往返延迟
- MTU：字节
6、断点配置：
作用：用来构建异常的测试场景
- 点击接口链接，选择breakpoints
- 在浏览器刷新对应接口页面
- 此时会自动跳到Charles并显示接口请求信息
- 点击edit response，可修改数据参数等
Charles的用途总结起来就是：代理、抓包、改包！
7、 有bug？想补充？
感谢大家观看这篇文章，有任何问题或想和我交流，请直接留言，
发现文章有不妥之处，也可指出交流，感谢阅读~
开启掘金成长之旅！这是我参与「掘金日新计划 · 2 月更文挑战」的第 6 天，点击查看活动详情
