还不会用 Charles？最后一遍了啊！

Charles，一个老生常谈的 HTTP 代理工具。我们平时联调或者定位线上问题都会频繁使用，这次我们再全面性的介绍下它的工作原理和使用场景。

Charles 的工作原理：

HTTP 代理工具，顾名思义它是在客户终端与互联网之间的代理服务器，可以拦截终端发出的 HTTP 请求，对其进行监听、改写等操作。常用于查看移动端请求、mock 接口、修改 HTTP 请求/响应。

安装并配置 Charles HTTPS 代理

鉴于本文的重点是如何使用 Charles，对于如何安装请点击这里查看教程

需要注意，配置 https 代理时，目前 IOS 已不支持通过打开 Charles 链接的方式下载描述文件，需要将文件下载下来传输到手机中打开。
Android 目前只支持代理 HTTP 请求，不支持代理 HTTPS 请求。

如何使用 Charles

Charles 的主界面

先介绍下 Charles 的主界面，其分为两种视图：

一种是Structure View，根据域名路径进行分类，配合 Filter 功能查看特定域名的请求非常有用
一种是 Sequence View，通过时间排序展示，并且显示了 duration。

请求详情

进入请求详情，我们可以查看到请求的全部信息，包括：

request 的 headers、cookies、URL payload 和 body 等数据
response 的 headers、set-cookie、result 等数据

HTTPS 请求代理

下面我们进行实战，将 https://shopic.sf-express.com/crm/webapp 代理到一个测试地址 http://s.sfjswl.com:10086 中

Map Remote

第一步，我们通过 Map Remote 能力，将 https://shopic.sf-express.com 域名转发到 http://s.sfjswl.com 域名上。

在 Tools 栏中选择「Map Remote」，不过我更推荐大家使用快捷键 option + command + M，从菜单栏中找这些小工具真的很费眼。。。

这里要注意：

要确认好协议是 http 还是 https，别写错了！
Map Remote 只能用于 修改域名，请求路径是不会改变的。

Map Rewrite

因为 Map Remote 只能转发域名，通过第一步我们相当于把 https://shopic.sf-express.com/crm/webapp 代理到了 http://s.sfjswl.com:10086/crm/webapp，然后就需要把 url 中的 /crm/webapp 干掉。

那第二步，我们就可以通过 Map Rewrite 能力，把 /crm/webpapp 替换为 /。它的快捷键是 option + command + R

从上图我们可以看到：

左侧是每个独立配置，可自由开启关闭。
右侧是具体规则，Location 用来匹配路径，匹配后则进行右下角的修改操作
Rewrite 的功能非常强大，它可以修改 HTTP 请求的所有信息

这里我们通过 Location 匹配到了 Remote 转发后的 s.sfjswl.com:10086/crm/webapp （注意这里要配的是 Remote 之后的地址 ）。然后通过改写 path 把 /crm/webapp 干掉，这样我们就顺利把 https://shopic.sf-express.com/crm/webapp 代理到 http://s.sfjswl.com:10086 了

下面我们再介绍一些 Charles 的常见用法：