【网络工具】Charles 介绍及环境配置

✍个人博客：Pandaconda-CSDN博客
📣专栏地址：http://t.csdnimg.cn/iAmAo
📚专栏简介：在这个专栏中，我将会整理一些工作或学习中用到的工具介绍给大家~

 📘Charles 系列文章：

• 【网络工具】Charles 介绍及环境配置
• 【网络工具】Charles 实战（上）
• 【网络工具】Charles 实战（下）

❤️如果有收获的话，欢迎点赞👍收藏📁，您的支持就是我创作的最大动力💪

一、简介

1. 什么是 Charles？

Charles 中文名叫青花瓷，它是一款基于 HTTP 协议的代理服务器，通过成为电脑或者浏览器的代理，然后截取请求和请求结果达到分析抓包的目的。

2. 工作原理

Charles 本质为 HTTP/HTTPS 代理，代理转发客户端的 HTTP/HTTPS 请求，拦截服务端响应处理后返回给真实客户端。

前置步骤：

1. 需要运行 Charles 并配置代理

2. 在客户端上面需要配置代理

具体实现步骤：

1. 由客户端发送请求

2. Charles 接收再发送给服务端

3. 服务端返回请求结果给服务端

4. 由 Charles 转发给客户单

3. 主要功能

1. 支持 HTTP 及 HTTPS 代理

2. 支持流量控制

3. 支持接口并发请求

4. 支持重发网路请求

5. 支持断点调试

4. Charles 的优点

对比 Fiddler 的优点：

1. Charles 能够支持 linux、MacOs

2. Charles 支持按域名和按接口查看报文，简洁明了

3. Charles 支持反向代理

4. Charles 网络限速可以选择网络类型

5. Charles 可以解析 AMF 协议

二、下载及安装

1. 下载

下载地址：https://www.charlesproxy.com/latest-release/download.do 默认端口：8888

2. 组件介绍

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

主导航栏介绍：

请求栏介绍：

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

• Structure 视图将网络请求按访问的域名分类（推荐）

• Sequence 视图将网络请求按访问的时间排序

请求数据栏介绍：

如果点击下面的 "Overview" 按钮，则会显示详细的接口信息。

三、配置方法

1. 前置步骤

前置要求 - 查看主机的 IP 地址：

1. 在 Charles 的页面中点击 "Help" 选项。

2. 点击 "Local IP Address" 选项。

3. 查看主机的 IP 地址。

2. 代理配置

下面默认配置端口为 8888，如果端口冲突，可以改成其它端口。

3. 访问控制

如果不在「IP Range」 客户端 IP 列表里的 IP，则需要根据 "Prompt to allow unauthorized connections" 选项是否勾选，从而判断是否能访问：

• 如果该选项「勾选」，则不在列表中的 IP 地址想要访问，会询问能否访问。

• 如果该选项「没有勾选」，则不在列表中的 IP 地址不会访问。

4. 客户端代理设置

4.1 Windows 代理设置

具体步骤：

1. 在 Chrome 浏览器中输入 Chrome://setting。

2. 在搜索框中输入 “代理”。

3. 点击 “打开您计算机的代理设置”。

默认开启，若未开启请按下图进行设置：

4. 在手动设置代理中，开启代理。

5. 在地址输入框中输入 Charles 的 IP 地址以及端口。

6. 点击 “保存”，关闭页面。

4.2 MacOS 代理设置

具体步骤：

1. 打开 Charles 页面，点击苹果标志，点击 "系统设置" 选项。

2. 点击 "网络"，进入对应网络的 "详情信息" 页面。

3. 点击 "代理" 选项。

4. 打开 "网页代理（HTTP）" 和 "安全网页代理（HTTPS）"，然后输入服务器的 IP 地址及端口。

注意：

这里的服务器信息就是前面在 Charles 上面查看的地址和端口。

5. 最后点击 "好" 按钮，保存配置信息。

4.3 MacOS 快捷代理设置

应用场景：

当 MacOS 客户端与运行 Charles 软件工具的电脑是同一台电脑时，可以通过快捷代理设置方式来进行设置。

具体步骤：

打开 Charles 工具后，选择 "Proxy" 菜单中的 "macOS Proxy" 选项。

4.4 IOS 手机代理设置

具体步骤：

1. 在 IOS 手机中选择 "设置" - "无线局域网" 选项。

2. 点击已连接的无线网络名称。

3. 在 HTTP 代理的配置代理中选择 "手动" 选项。

4. 输入服务器 IP 地址以及端口，点击 "存储" 按钮。

4.5 Android 手机代理设置

具体步骤：

1. 在 Android 手机中选择 "设置" - "WLAN" 选项。

2. 长按已连接的无线网络名称，点击 "修改网络"。

3. 勾选 "显示高级选项"。

4. 在代理选项中选择 "手动" 选项。

5. 输入服务器 IP 地址以及端口，点击 "存储" 按钮。