目录
作用:
①用Charles来分析前后端的问题;
②用Charles模拟弱网测试环境;
③用Charles的断点构建异常的测试场景
④支持HTTP及HTTPS代理
⑤支持流量控制
⑥支持接口并发请求
⑦支持重发网络请求
⑧支持断点调试
一.Charles简介
它是一款基于http协议的代理服务器,通过成为电脑或者浏览器的代理,然后截取请求和请求结果达到分析抓包的目的。
工作原理:
1.需要运行Charles并配置代理(前提)
2.在客户端上面需要配置代理(前提)
3.由客户端发送请求
4.Charles接收再发送给服务端
5.服务端返回请求结果给Charles
6.由Charles转发给客户端
特点:跨平台,半免费【使用30分钟之后会强制退出】
优点:(对比Fiddler的优点)
Charles能够支持Linux、macOS,Fiddler只支持Windows;
Charles支持按域名和按接口查看报文,简洁明了;
Charles支持反向代理;
Charles网络限速可选择网络类型;
Charles可以解析AMF协议
二.Charles安装与配置
(1)Charles安装
下载地址链接: charles下载
双击安装目录中的exe文件打开Charles
(2)Charles组件介绍
(3)Charles设置
①代理设置(先在“局域网设置”中设置代理服务器的地址和IP)
②访问控制
(4)客户端设置
Windows代理设置
IOS手机代理设置
①在IOS手机中选择“设置”-“无线局域网”
②点击已连接的无线网络名称
③在HTTP代理的配置代理中选择“手动”
④输入服务器IP地址及端点,点击“存储”
Android手机代理设置
①在Android手机中选择“设置”-“WLAN”
②长按已连接的无线网络名称,点击“修改网络”
③勾选“显示高级选项”
④在代理选择项中选择“手动”
⑤输入服务器IP地址及端口,点击“存储”
三.Charles实战
(1)问题分析
是前端的问题还是后台的问题呢?
1.抓包分析问题-1
在人事管理系统中修改员工的信息时,如果员工姓名超长会产生以下两个问题:
问题一:会提示“系统繁忙”
问题二:会显示两次提示信息
2.抓包分析问题-2
实施步骤:Charles代理配置 —— 客户端代理配置 —— 操作客户端软件 —— 分析请求数据
3.抓包分析问题-3
问题一:提示“系统繁忙”的信息是由后台返回的,所以此问题是后台开发代码的问题
问题二:会显示两次提示信息,但后台只返回一个请求结果,所以此问题是前端开发的问题
(2)https抓包
乱码:如何解决?需要安装SSL证书
Windows证书配置
1.打开Charles,选择“help” —— “SSL proxying” —— “install Charles Root Certificate”
2.在打开的证书框中,点击“安装证书”,选择“本地计算机”,点击“下一步”
3.选择“将所有证书都存放下列存储”,再点击浏览
4.选择“受信任的根证书颁发机构”,点击“确定” —— “下一步” —— “完成”
iOS证书配置
1.在电脑上运行Charles,且iOS手机设置好代理,在浏览器中地址栏输入:http://charles.proxy.com/getssl
2.进行下载安装
3.返回到“通用”界面,选择“关于本机”
4.点击“证书信任设置”,启用Charles proxy CA证书并确认
Charles https代理配置
步骤一:在Charles窗口点击菜单“proxy” —— “SSL proxying setting”
步骤二:在打开的设置窗口中勾选“Enable SSL Proxying”
步骤三:添加Location时,将Host与Port同时设置为*
步骤四:点击“OK”
然后清除已抓到的包,重新访问路径再重新抓包就不会乱码了
(3)弱网测试
Charles流量配置
1.在Charles窗口中点击菜单“proxy” —— “Throttle Setting”
2.在打开的设置窗口中勾选“Enable Throtting”
3.在“Throttle preset”下拉框中选择对应的网络类型
4.点击“OK”
弱网测试实例
将Charles的网络流量配置成56K modem的网络,查看人力资源网站的员工菜单打开情况?
先在不设置网络的正常情况下查看网站的打开情况,然后再设置网络查看网站的打开情况,两者进行比较【从时间分析,从页面展示状态分析】
(4)断点调试
作用:用来构建异常的测试场景
1.右击接口链接,选择“Breakpoints”
2.在浏览器刷新对应接口的页面
3.此时会自动跳转到Charles并显示出接口请求信息
4.点击“Edit Request”,修改请求的信息,点击“Execute”
5.点击“Edit Response”
6.在数据格式栏中选择合适的显示格式,比如“Json”
7.修改对应的数据,点击“Execute”
8.回到浏览器查看数据应该为修改之后的Response的信息
断点调试实例
场景一:在人事管理系统中增加角色时,把角色名设置为空,然后请求到服务器
数据为空都能添加成功,说明后台代码有问题
场景二:针对查询员工接口请求时,修改返回数据success=false,code=999,message=操作失败
修改返回结果之后,网页报错,数据无法展示,可以判断为正常