1 前置知识点

此处需要先简单解释几个概念

1.1 http

浏览器和服务的交互建立在http之上，而http则是建立在稳定的TCP之上

1.2 https

https协议相对于http协议而言，是在http层和TCP层中间增加了SSL/TSL层，这一层主要是用于保障通讯安全，保证他人截取中间的信息的时候，是无法读懂的。

1.3 中间人攻击

正常情况下，在http或者https下，客户端和服务端之间的交互从逻辑上来讲是直接交互的

但是由于网络环境很复杂，其实会容易出现中间人的情况。中间人会代理浏览器的所有流量，替浏览器执行资源的访问，这样子就能得知甚至修改其中的内容。即使是https也可以在发起连接的时候做劫持。（这也是为什么说https也不一定安全的原因）

1.4 证书

为了保证网站访问的安全，增加了证书这一道保障机制，这套机制也是基于https的。接下来深入理解一下https的建立过程。

1.4.1 对称加密（略）

1.4.2 非对称加密技术

刚才没提到的，在https中的s，代表的SSL/TSL层其实就是在非对称加密的基础上实现的。公私钥是通过某一个算法得到的一对秘钥，破解难度很大，必然是成对出现的。特点：速度慢，安全性高。

• 公钥加密，私钥解密，可以用于保证内容的安全性；
• 私钥加密，公钥解密，可以用于确认内容来自于某个指定的主体；（私钥的泄露会导致身份被伪造）

1.4.3 理解https建立过程

非对称秘钥加解密速度比对称加密慢很多。所以仅仅是通过非对称加密的方式来传递 对称加密的秘钥，在通讯的双方获得了对称加密的秘钥之后，之后的通讯内容均使用对称秘钥来进行通讯。那么非对称加密在这一个连接建立的过程中主要作用就是传递对称秘钥。

这里能理解秘钥的安全性需要依靠公钥，但是公钥的分发过程其实也是可能会被拦截的，中间人可以拦截了之后向浏览器分发自己的公钥，建立了双向的https链接，就能截获内容并做篡改等操作。

为了安全分发公钥，则有证书的出现。

1.4.4 证书

可信任的证书颁布者在对网站检查过后，会对改网站相关的信息，以及公钥等内容，使用的证书颁布者的私钥进行加密，形成证书。以供网站在提供服务的时候，传递出去告诉浏览器当前网站是可信的。

这样子，浏览器在拿到网站的证书的时候，可以直接拿可信任颁发者的公钥进行解密，解密成功了，即是正常的。

1.5 客户端如何验证证书的有效性

我们的客户端有很多种类型，Android，iOS，macOS，Windows，各种浏览器。其实都内置了一部分的绝对可信的机构的根证书。所以在验证的时候，如果最终的颁布者是这些其中之一，就可以信任对应的网站。当然还有一种做法，那就是用户自行安装证书，并且通过系统设置，对该证书进行信任，那么相应的证书就会被信任，而不会有红色警告。

总结：说了这么久，其实大家相比也知道了，网络代理工具，在这里，其实扮演的就是一个中间人的角色，并且，我们能通过这些网络代理工具生成的证书，安装到我们的设备中，实现系统或者浏览器对其的信任，从而实现抓包。

2 Charles代理的使用

http自然不必再说，就是裸奔，直接抓包即可。https则需要代理工具需要先生成证书，开启ssl监听，将证书安装到系统（各种系统）中，并开启信任。才能实现抓包。

2.1 配置

• 首先是需要开启当前设备代理模式

在这种情况下打开www.baidu.com，自然是不能正常展示页面的。

并且在charles中看到的情况是这样的。

• 所以需要安装证书，这里提供了macOS下的证书安装。

  • 第一个红框为为当前设备安装证书。

  • 第二个红框中第一个选项，则是向远程设备，比如iOS或者Android端安装证书，会有弹窗教程，根据描述来操作就可以安装了。

  • 如果不行，则用第二个红框中第二个选项，保存证书，有两种格式pem或者cer的，手动传输之后再进行安装。

• 在钥匙串中安装完之后，双击对应的证书，会发现并没有被信任。将 使用此证书时 的选项修改为 始终信任 即可。

• 再配置代理所有的https的请求。

可以设置需要进行代理的域名和端口号，这里的 : 代表了代理所有的域名所有的端口号。

于是便能代理所有的https的请求，在其他的设备上也是类似的操作。能到这一步即是正常代理了。

判断设备是否证书是否正常被信任的最好办法就是在浏览器（最好是chrome，排除其他app中可能会有单独做拦截的可能）中打开某个具体的https的网页，能正常显示，且charles能正常看到https包中的内容。

2.2 MapLocal

这一功能相当于将匹配的流量，代理到本地的某一个具体的文件，可以配置正则。

• 可以通过右击某个具体请求，来更改它所访问的内容，如下

然后直接进行配置即可。

• 也可以通过tools菜单找到Map Local来进入对应的页面。

此处的add也会进入详情页面。

这样就把访问baidu.com的流量代理到本地的index.html了，并且不会有证书不安全的警告。

• 成功代理的证明如下，在charles中的notes会有显示。

或者在请求的response header中会有charles的明显标识。

2.3 MapRemote

这个功能相当于把某一指定的流量指向另外的远程资源，这里的例子是用百度的域名去访问知乎。

配置也是有两个入口

• 右击具体的访问路径进入

则会进入详情设置界面，然后可以将其Map To设置为知乎的域名。

• 通过tools的mapremote进入总览界面，也可以进行添加。

然后访问百度的域名。即可看到知乎的页面，这个在header好像还找不到标识，所以出现代理混乱的时候最好先检查一下remote这里的配置。

2.4 breakpoint

这个功能用于每次需要对某个具体的请求做一些修改，比如对其url，header，cookies等做出临时性的修改。右击某个具体的url，然后选中breakpoints。

则在下一次发起请求的时候，将自动进入当前的界面，此时为中断发起请求的状态。

1的位置，可以查看要修改url或者header的位置，2位置则是可以直接对内容进行增删查改，3位置则是继续发起请求。

上图中execute之后，就会以修改后的情况发起请求，然后在返回的时候还会再有一次拦截。此时可以对response进行修改操作，跟request的拦截界面类似。

这里可以做的操作，cookies的修改，header中跨域参数的修改等等。

2.5 Rewrite

用于处理一些重写规则，重写header等。通过tools->rewrite打开规则界面。

在1中可以添加规则集，2中可以增加需要应用在哪些符合规则的请求中，3可以添加具体的替换规则，新增规则，删除规则。

新增需要应用的域名比较简单。

具体规则中，1为操作类型，比如新增加header字段，替换字段等。

2则是选择在request中或者response中去实现这个效果。

3则是具体的内容。

以下则为增加一个header参数的配置。

最终可以直接在浏览器中response看到具体的内容。

2.6 总结

上述的2.2-2.5之间的能力，可以在web端和移动端通用，只要能抓取到相应的流量，即可进行任何操作。

• maplocal可以用于将流量代理到指定的本地静态文件。
• mapserver可以用于将流量代理到指定的web服务器（包括本地启动的开发服务器）。
• breakpoint可以用于暂停请求的request和response。
• rewrite可以重写request或者response中的头部信息等等。