1、工具介绍
Charles是一款在Mac下常用的数据包截取工具，在做移动开发时，为了调试移动端与服务端的网络通讯协议，常常需要截取网络数据包来进行分析。
Charles主要功能包括：
截取Http和HTTPS网络封包；
支持重发网络请求，方便后端调试；
支持修改网络请求参数；
支持网络请求的捕获并动态修改；
支持模拟慢速网络。
Chrome 和 Firefox 浏览器默认并不使用系统的代理服务器设置，而 Charles 是通过将自己设置成代理服务器来完成封包截取的，所以在默认情况下无法截取 Chrome 和 Firefox 浏览器的网络通讯内容。如果你需要截取的话，在 Chrome 中设置成使用系统的代理服务器设置即可，或者直接将代理服务器设置成 127.0.0.1:8888 也可达到相同效果。
Fiddler的功能非常多，在实际使用过程中，经常用到的功能其实就那么几项，所有说fiddler有点大材小用，相反Charles界面简洁，这也是我一接触就抛弃fiddler的原因。
2、菜单功能介绍
首先来看下界面，包括两种视图模式（Structure + Sequence），如下图：
Structure模式
Sequence模式
包括6个主菜单，分别为：File、Edit、View、Proxy、Tools、Window。
2.1、File菜单介绍
该菜单下包括如下功能：
New Session：开启一个新会话，可以新建一个会话页面，这样就能在不同的会话页面抓取不同页面的数据包了。
Open Session：打开保存的会话文件
Clear Session：清除会话内容，会清空已经抓取到的数据包
CloseSession：关闭会话
Save Session：保存会话
Save Session As：会话另存
Import：导入会话信息
Export Session：导出会话信息
与Fiddler对比：在fiddler中新建会话会再启动一个客户端，Charles则相对来说更加方便。
2.2、Edit菜单介绍
该菜单下包括如下功能：
Cut：剪切-对选中的请求执行剪切操作
Copy：复制-对选中的请求执行复制操作
Paste：粘贴-对剪切的请求执行粘贴操作
Select All：选中当前会话页面的所有请求
Find：可以在制定的范围内查找关键字内容
Preferences：界面样式及字体等设置
2.3、View菜单介绍
该菜单下包括如下功能：
Structure：工具介绍一章中介绍的两种视图模式，按访问的域名分类
Sequence：工具介绍一章中介绍的两种视图模式，按访问的时间排序
Overview：HTTP/HTTPS请求的概要信息
Request：请求的详细内容
Response：服务端根据请求返回的数据内容
Summary：汇总请求包括哪些资源，耗时及数据包大小信息
chart：请求包括的资源耗时分析
Notes：日志信息
View Request As：以怎样的方式查看请求
View Response As：以怎样的方式查看服务端返回的内容
后续的菜单一般很少用到，这里不再列举
2.4、Proxy菜单介绍
Start Recording：结合Recording Settings使用，捕获的开关；
Start Throttling：结合Throttling Settings使用，模拟各种网络环境；
Enable Breakpoints：结合Breakpoint Settings使用，启用断点；
Recording Settings：监听设置，可以设置监控的目标主机名、协议、端口和关键字等信息；
Throttling Settings：模拟各种网络环境，包括：3G、4G等场景；
Breakpoint Settings：断点设置，有时候对于一些特殊请求在发往服务器之前想要修改一些参数，或者在服务器响应完成之后修改响应信息，此时可以使用Charles的断点功能；
Reverse Proxies：反向代理功能，将发往目标端口的数据，发送到本地
Port Forwarding：重定向功能，将发往本地端口到的数据，发到其他环境中
Windows Proxy/Mozilla Firefox Proxy：设置为系统代理/设置为火狐浏览器代理
Proxy Settings：代理的设置选项
SSL Proxying Settings：抓取https数据包的设置
Access Control Settings：设置抓取的目标IP的
External Proxy Settings：把经过Charles的请求转到其他代理服务器（如fiddler），适用于特殊情况下需要用到两个软件的特点进行开发的时候；
Web Interface Setting：在web页面访问Charles，用处不大
2.5、Tools菜单介绍
该菜单下包括如下功能：
No Caching：无缓存访问请求，接来下的都不再从缓存中读取
Block Cookies：阻止发送和接收cookie，默认针对所有请求，也可以针对指定请求
Map Remote：将指定的网络请求重定向到另外一个地址
Map Local：将指定的网络请求重定向到本地的地址，将网络请求通过 Map Local 映射到了本地的一个经过修改的文件中；
Rewrite：对某一类的网络请求进行一些正则替换，以达到修改结果的目的；
Black List：黑名单列表，输入不想访问的地址等，
White List：白名单列表，输入允许访问的地址等信息
DNS Spoonfing：DNS 欺骗设置
Compose/Compose New：手动构造请求
Advanced Repeat：请求迭代次数的设置
后面几项基本不用，不在列举
2.6、Window菜单介绍
该菜单下包括如下功能：
Session*：切换会话窗口，如果有多个会话的话，这里就会显示多个会话列表
Error Log：显示程序的错误日志
Active Connections：显示处于未关闭状态的连接请求
3、操作介绍
3.1、过滤网络请求
在抓包的时，通常会抓到大批量的数据包，后期不方便查看，这时候我们需要对网络请求进行过滤，有3种方法：
①在主界面的中部的 Filter 栏中填入需要过滤出来的关键字。例如要查看”www.baidu.com”的数据包
②选择Proxy下的Recording Settings，填写要过滤的信息，如下图
确定后，再访问页面时，”www.baidu.com”之外的数据包不会被抓取到。
③选中要过滤的某类请求，右键选中”Focus”，再在主界面上勾选”Focused”。
3.2、抓取http的数据包
选择“Proxy”下的“Proxy Settings”，在“Proxies”页面填写监听的端口号，勾选“Enable transparent HTTP proxying”，如下图：
在手机网络设置里面填写代理服务地址信息
确保手机和电脑在一个网段(连接同一个路由器)，服务器中填写电脑的IP，端口就填写刚才页面的Port端口号，返回wifi列表页。
设置好之后，我们打开手机上的任意需要网络通讯的程序，就可以看到 Charles 弹出请求连接的确认菜单（如下图所示），点击“Allow”即可完成设置。
确定后就可以抓到手机app发给后台的数据包了。
3.3、抓https的数据包
如果需要截取分析Https协议相关的内容。那么需要安装Charles的CA证书。
首先需要在电脑上安装根证书。选择”Help”>>”SSL Proxying”>>”Install Charles Root Certificate”，弹出证书的安装页面，如下图：
点击“安装证书”，直接全选择“下一步”，可以看到提示“导入成功”，最后点确定关闭页面。
接下来在手机上安装证书，点选择“Help”>>“SSL Proxying”>>“Install Charles Root Certificate on a Mobile Phone or Remote Browser”，按照弹出菜单将手机的代理设置为。
提示中的IP地址和端口号，设置完成后用手机浏览器访问“http://chls.pro/ssl”即可打开证书安装的界面，安装完证书后，就可以截取手机上的 Https 通讯内容了。
手机设置代理IP时，系统有可能出现如下提示信息：
这里选择“Allow”，否则就无法抓取到数据包了。
需要注意的是，即使是安装完证书之后，Charles 默认也并不截取 Https 网络通讯的信息，试着抓包后发现还是加密的内容，选择“Proxy”>>“SSL Proxying Settings”>>“Add”，填写服务端地址和端口(443)，确定后就可以抓取https数据包了。
注意：
通过工具可以抓包，是不是说https就是不安全的了呢，毕竟所有的请求对我们来说都是透明的呢。其实刚才的过程很重要的一点就是我们下载并且安装了Charles的根证书。而对https的安全来说，https安全的前提就是可信的根证书！！！！而之前的操作无疑是在我们系统里面安装了不可信的根证书。使得Charles对我们的通信造成了中间人攻击！。简单的说就是我们与服务器进行通信，会先获取服务器的证书，进行校验校验过程是用本地的可信根证书进行校验，而装入Charles的根证书后，Charles可以伪造证书，获取我们与服务器通信的秘钥，进行破解我们的通信。所以对我们我们系统来说安装证书是一个多么危险的操作！
哐哐哐！！查水表！！！
3.4、模拟慢速网络
在调试代码的过程中，有时候要模拟各种各样的网络场景，目的是验证服务端能否正确的处理请求，应用的表现是否正常。而Charles对此需求做了很好的支持。选择“Proxy”>>“Throttle Setting”，弹出菜单中选择“Enable Throttling”同时可以指定主机的请求模拟慢速网络。
支持的网络场景包括ADSL、3G、4G等。设置完毕后选择“Proxy”>>“Start Throttling”开始模拟场景。
3.5、修改网络请求
切换到Sequence模式，在需要修改的请求上右键，选择“Compose”后在下方就会新建一个请求，接着就可以修改请求的参数值了。
3.6、简单压测操作
在要选择的请求上右键，选择“Repeat Advanced”填写要重复执行的次数后，点击ok之后就会按照设置的次数进行重复访问了。
3.7、Map重定向功能
重定向功能包括Map Remote 和 Map Local两种。顾名思义，Map Remote 是将指定的网络请求重定向到另一个网址请求地址，Map Local 是将指定的网络请求重定向到本地文件。
在 Charles 的菜单中，选择“Tools”->”Map Remote”或“Map Local” 即可进入到相应功能的设置页面。
如下就是实现将测试环境的请求重定向到线上环境
3.8、Breakpoints功能
待续
3.9、反向代理功能
Charles 的反向代理功能允许我们将本地的端口映射到远程的另一个端口上。例如，在下图中，我将本机的 61234 端口映射到了远程（test.deji.com）的8080端口上了。这样当我访问本地的 61234 端口时，实际返回的内容会由 test.deji.com 的 8080 端口提供。
选择“Proxy”>>“Reverse Proxies”，弹出如下图：
填写端口号和服务端的IP即可。
网友评论