如果该分享对您有帮助,请记得 “👍点赞” “✍️评论” “💙收藏” !比心❤️
一、Fiddler简介
1.Fiddler是位于客户端和服务器端的HTTP代理。
2.功能非常强大,是web调试的利器。
(1)监控浏览器所有的HTTP/HTTPS流量
(2)查看、分析请求内容细节
(3)伪造客户端请求和服务器响应
(4)测试网站的性能
(5)解密HTTPS的web会话
(6)全局、局部断点功能
(7)第三方插件
3.使用fiddler场景 (注:(1)-(4)是测试经常的应用场景)
(1)接口调试、接口测试 (章节三-5-(3)中有举例)
没有接口文档时,可以通过fiddler抓包,查看请求方式、请求路径、请求参数、请求头等信息,然后在接口测试工具里面进行测试。
(2)精准定位前后端Bug (章节三-5-(2)有举例)
a.查看请求的参数是否有误,如果有问题,说明是前端问题
b.如果没问题,查看后端的返回值。
(3)弱网断网测试 (章节三-1-(3)有举例)
(4)络胁持和线上环境调试
(5)web性能分析
(6)开发环境hosts配置、mock
二、Fiddler的工作原理: (1)Fiddler 是以代理 Web 服务器的形式工作的。
(2)Web 代理(Proxy Server)服务器是网络的中间实体。代理位于 Web 客户端和 Web 服务器之间,扮演“中间人”的角色。
(3)此时客户端请求服务器的过程,还是服务器发起户端的响应的过程,都能通过fiddler来监听。(相当于在服务器和客户端正常对话时,fiddler在中间插了一刀,劫持了双方交流的信息)
fiddler工作原理
(4) Fiddler为什么可以抓包?Fiddler本质上是一个web代理服务器,打开tools→Options…→Connections,设置默认的端口为8888,设置系统代理,如下图所示:
(5)Fiddler默认只能抓取http协议的数据包,我们需要配置下https的SSL证书。
a.打开Fiddler,菜单栏:Tools –> Fiddler Options 打开fiddler配置。
b.打开 HTTPS 配置项,勾选Capture HTTPS CONNECTs和Decrypt HTTPS traffic,点击OK,然后重启,如下图
配置HTTPS代理
三、fiddler界面: Fiddler主要由菜单栏、工具栏、会话列表、功能页签、命令行,状态栏六大块组成。
界面组成
1、菜单栏
(1)File(文件)
File(文件)
(2)Edit(编辑)
Edit(编辑)
(3)Rules(规则)
Rules(规则)
❤️弱网测试❤️ a)、什么是弱网测试“?
通常低于3G网络速率和弱信号的Wifi都属于弱网。弱网测试主要是对网络带宽、丢包、延时等进行模拟弱网环境去测试不同应用软件,属于健壮性测试。”
b)、为什么做弱网测试?
“弱网测试的目的是帮助产品在网络环境较差的情况下仍能正常上网,比如在地铁里,公交上,甚至是电梯,车库等等的场景里去关注一些新闻,看看小说,直播,玩游戏等等。在这个时候,我们就需要针对这些场景,去关注一下应用的运行状态,以及弱网环境下,出现丢包、延时软件的处理机制,避免造成用户的流失。
c)、怎么用fiddler做弱网测试?(可以用fiddler模拟弱网环境)
打开fiddler ->Fiddler,Rules->Performance->勾选 Simulate Modem Speeds,勾选之后访问网站会发现网络慢了很多.
打开fiddler ->Fiddler,Rules->Performance->勾选 Simulate Modem Speeds,
❤️例,登录课堂派,明显看到设置网络延迟后,在Timeline 请求响应时间列表中,响应时间变慢了很多。
我们还可以编辑脚本限速,在Fiddler菜单栏选择Rules--->Customize Rules(自定义规则)或快捷菜单打开FiddlerScript打开代码,然后找到if(m_SimulateModem)来修改脚本。(2G和3G上下行速率可在百度自行查看)
注意: Simulate Modem Speeds(模拟调制解调器速度) 依旧要为勾选状态!
脚本设置弱网测试
(4)Tools(工具)
Tools(工具)
(5)View(视图)
View(视图)
2、工具条界面
工具条界面
(1)气泡框(备注):给session list中的会话添加备注。选中一条会话,再点击该气泡按钮可直接添加备注内容。添加成功后将会在Comments 栏下查看到该备注
(2)Replay重新请求:如果想要对某个请求进行发送的时候,可以点击这个按钮对该请求再一次发送请求。(快捷键R)
a)、shift+R可以选择对该接口发送几次请求,及简单的压力测试
b)、ctrl+x 删除所有请求
c)、shift+delete 删除非选中的请求
d)、delete 删除选中的请求
(3)X按钮: 清空监控面板 Ctrl + X:可以清除面板上全部或某些请求。
(4)Go按钮:该功能主要针对断点,在底部状态栏空白处,单击一次,生成请求前断点,此时请求从客户端发送到fiddler代理处,并未发送到 服务器,点击Go按钮,请求从fiddler发送至服务端。
(5)Stream(流模式/缓存模式):与浏览器实际请求的模式一致,服务器响应什么数据,立即返回前端,fiddler默认的模式为缓冲模式,缓冲模 式下,服务器把所有数据全部响应回来之后,fiddler再将数据响应给客户端,该工具不常用,在缓冲模式下,可以进行fiddler的其他功 能,比如断点、伪造请求等。
(6)Decode(编码/解码):某些请求,服务器返回的时候会做编码或压缩,Decode可以将所有的请求进行解码。点击下图黄色位置,可对单条请求进行解码。
乱码问题如何解码
(7)Keep All Sessions(保存会话):表示保存会话的数量,默认保存所有会话,注意的是Fiddler保存的会话状态越多,占用的内存越大。性能不好,建议不要保存所有会话,可选择修改数量。
可以修改保存的数量
(8)Any Process: 过滤请求(靶心形状按钮是帮我们过滤不想看到的进程发出的请求,只保留我们要看到的进程的请求。方法是比如只想看谷歌浏览器请求,把靶心拖动到谷歌浏览器放开即可。)该功能可以只捕获某个客户端或进程发送的请求,点击Any Process拖动鼠标到指 定客户端或者进程上。
(9)find(查询):查找请求,快捷键Shift+F,可以查找包含指定内容的请求(可单独指定请求过程或者响应过程,检测header或body),并以 黄色高亮显示,如下所示:
(10)Save(保存):保存捕获到的会话,保存后只需要把保存的saz文件打开即可查看。
(11)切图(截图):点击后会倒计时,计时后帮我们截图。
(12)计时器:左键单击一下开始,再单击一下停止,右键清零。
(13)Browse:快速启动浏览器(也可选择下拉框中别的浏览器:IE,火狐,谷歌,edge等)。
(14)Clear Cache:清除 WinINET 的缓存,按住 CTRL 键点击可以清除已经存在的 cookies 。
(15)TextWizard:编码和解码工具,比如base64,urlencode,urldecode,md5等,比如模拟get请求,可以将请求参数转为urlencode 。
(16)Tearoff:此功能用来将右边栏里的请求和响应部分给单独拆成一个新窗口,方便视。
3、Fiddler 监控面板
用户抓到数据包后,显示在左侧列表中,其中有许多列名和图标,接下来挑几个重要的看一下。
监控面板
部分列名和图标的含义
4、命令行+状态栏详解
命令行+状态栏
(1)下面是部分常用命令:(想了解更多命令可以搜索help,在官网查看命令)
a)、查找对应请求类型数据包(例如:输入“=post”将选择post的数据包并用蓝色底标色;)
查找对应请求类型数据包
b)、查找对应响应码的数据包(例如:“输入=200”将选择响应码为200的数据包并用蓝色底标色;)
查找对应响应码的数据包
c)、搜索带有某个关键字得session(例如:“输入?baidu.com”将选择包含关键字baidu,com并用蓝色底标色;)
搜索带有某个关键字
d)、按响应尺寸筛选(例如:“输入>800”将选择大于800的数据并用蓝色底标色;)
按响应尺寸筛选
e)、选择指定host的session(例如:输入“@www.jianshu.com”,将选择指定host的会话并用蓝色底标色)
f)、 对带有某个字段的请求包字体加粗(例如:“输入bold baidu”,取消加粗再次输入bold敲回车即可)
5、辅助标签+工具(以下只讲测试中常用的几个)
辅助标签+工具
(1)Statistics(统计):HTTP 请求的性能和其他数据分析,如 DNS 解析的时间,建立 TCP/IP 连接的时间消耗等信息。
a)、request count:请求数,表示该session总共发起了多少个请求。
b)、Bytes sent:发送请求的字节数(包括请求头和请求体)
c)、Bytes received:接收到的字节数(包括响应头和响应体)
d)、clientconnected:客户端连接的时间;
f)、clientbeginrequest:客户端开始发送请求的时间;
g)、gotrequestheaders:获得请求头文件的时间;
h)、clientdonerequest:客户端完成请求的时间;
i)、determine gateway:确定网关使用的时间;
j)、dns lookup:查看dns使用的时间;
k)、tcp/ip connect:tcp/ip 连接使用的时间;
l)、https handshake:https握手使用的时间;
m)、serverconnected:服务连接发生的时间;
n)、fiddlerbeginrequest:fiddler开始请求的时间;
o)、servergotrequest:服务器得到请求的时间;
p)、serverbeginresponse:服务器开始响应的时间;
q)、gotresponseheaders:得到响应头文件的时间;
r)、serverdoneresponse:服务器完成响应的时间;
s)、clientbeginresponse:客户端开始响应的时间;
t)、clientdoneresponse:客户端完成响应的时间;
u)、overall elapsed:全部花掉的时间(使用客户端完成响应的时间-客户端开始请求的时间)
Statistics(统计)
(2)Inspectors 请求与响应数据查看:快速查看http请求与响应报文(双击某一个会话请求就会自动跳转到Inspectors选项卡)
🍐 日常的测试过程当作,我们主要观察的是请求的入参跟返回的出参,对比其数据的准确性(如何确定是前端还是后端bug)
a)、对照接口文档,看对应的接口有没有触发请求,如果没有请求(没有调用接口)或请求有问题,那就是前端的BUG;
b)、如果前端请求没问题,那么看响应,先看响应的状态码,如果返回报错,看报错的状态码是什么,然后进行原因排查,根据接口文档,看前端传参是否正确,如果是前端传参不对导致后端返回错误,那就是前端问题;如果传参正确,后端处理不正确,那可能就是后端问题。
c)、一般响应码以4xx开头,如400、403等是前端问题,可能是url地址填错了,或者请求参数有问题;返回的响应码以5xx开头,如500、503,就是后台的问题;返回的响应码以5xx开头,如500、503,就是后台的问题。.............
🍐抓包后, 在监控面板查看信息, 点击一下Raw就可以看到报文,,上半面是请求头报文、下面是响应报文
快速查看http请求与响应报文
🍐当然除了Raw查看之外,还有多种格式可以查看请求和响应的内容,可根据需求自行判断需要哪种,不同格式含义如下:
不同格式的含义
(3)AutoResponder 自动拦截请求(自动响应器):是将HTTP请求拦截下来,重定向到本地文件或者指定响应结果,实现自动重定向的功 能。 不管我们做URL重定向,还是做Mock测试、本地js调试等,都可以通过该功能进行实践。
AutoResponder 自动拦截请求
🍐 Fiddler其实还有很多内置的响应规则,根据实际情况和需求来决定需要选择哪种进行测试。
内置响应规则
🍐使用场景:线上环境出现了问题,如果在线上环境进行调试会影响到正在使用的用户,所以此时就需要用到AutoResponder进行本地调试。如下是3种实操讲解;
1、使用内置响应规则:
❤️例:对百度首页图片替换成内置响应404(Not Found)
a)、首先抓包找到首页图片URL ,然后设置对应的规则,保存。
对百度首页图片替换成内置响应404
b)、保存成功后,打开百度一下,shift+F5(去缓存刷新),效果图下;
2、重定向到本地资源
❤️例:抓取百度logo图片会话,最后把这个图片会话响应给替换成本地资源。
a)、选择find a file,选中自己想上传的图片,保存后,shift+F5(去缓存刷新),效果图下;
首页logo被篡改了
3、自定义响应
❤️以课堂派为例,修改登录后的msg信息(这种方式可以测试没做好的接口)
a)、模拟请求在课堂派首页输入用户名和密码,响应提示“用户名错误”,抓取该请求在fiddler中查看响应信息,效果图下;)
b)、将抓取到的登录请求,拖动到AutoResponder,右击选择edit responder,然后编辑响应结果为“用户名不存在”
c)、保存后关掉窗口,在浏览器中课堂派页面点击登录,查看fiddler中响应数据,message变为“用户名不存在”
🍐 总的来说通过这种中间截获的手段并篡改响应资源的手法就可以实现很多资源响应的修改,当然修改html、css、js等资源都是可以的 ,这 极大方便了开发模拟请求和响应测试!
(4)Composer 设计请求发送到服务器:建HTTP Request然后发送请求,允许自定义请求发送到服务器,即可以手动创建一个新的请求,也可在会话表中拖拽一个现有的请求。
Composer 设计器
🍐 Composer起到的功能和Inspectors中的作用一样,都是篡改数据,不过Composer可以篡改Cookie中的数据。也就是说,Inspectors篡改的是 我们输入的数据,例如密码输入什么就是什么。而Composer篡改的是经过处理后的,例如Cookie中的数据,其实密码已经是加密了的,总之Composer可以帮助你去发送数据包,帮助你去做一些简单的接口测试(发包工具、可以发送数据包)
a)、我们可以把抓包的数据直接拽到Composer中,获取接口的所有的请求信息
b)、例如:抓取课堂派的登录接口
❤️首先输入不存在的用户名和密码,获取登录接口
🍐修改账号密码发送请求(在composer里修改正确的账号密码,然后查看返回结果,已经是登录成功了)
(5)Filters 请求过滤器:Filters过滤器的作用,过滤出我们想要的请求,因为抓包后会话列表中会存在大量的请求会话, 为了更加方便快捷的找到我们所需的请求,我们就可以用Filters过滤掉不需要的请求。(如下如是7部分过滤功能)
Filters 请求过滤器
a)、Hosts主机过滤:
Hosts主机过滤
❤️例1:只选择了内网“Show only Intranet Hosts,访问百度就不会抓到包,反之选择外网的”show only Internet Hosts“就可以。
❤️例2:设置show only the following Hosts (仅展示以下指定主机的请求) 左侧列表只会显示设置的会话请求,以百度为例,设置好后点击一下Actions中的Run Filterset now(运行过滤)。
注:设置好请求的地址后,会话框中哪怕https://www.baidu.com/的请求,也会被过滤掉,显示不出来。)
b)、Client Process客户端进程过滤
Client Process客户端进程过滤
❤️例:勾选show only Internet Explorer traffic,就只能显示ie浏览器的请求会话,其他浏览器请求都不会显示。
c)、Request Headers :根据请求头信息进行过滤
Request Headers
功能及含义
❤️例:勾选show only if URL contains,设置字符串,执行后,只会显示指定包含这个字符串的会话(其他功能自行按照意思尝试,这里不做举 例)
d)、Breakpionts:设置断点
Breakpionts:设置断点
e)、Response Status Code:请求状态码过滤
Response Status Code:请求状态码过滤
❤️例:勾选Hide non-2xx(隐藏响应状态码不是2xx的URL请求。
勾选Hide non-2xx
f)、Show all Content-Type:根据响应类型和报文大小进行过滤(这些功能可以测试一些资源等加载失败的情况下页面的展示情况)
Show all Content-Type
❤️例:禁止掉页面上的css js 等资源
禁止掉页面上的css js 等资源
g)、Response Header (根据响应头信息进行过滤)
Response Header (根据响应头信息进行过滤)
❤️例:勾选Flag responses that set cookies(会话列表的响应中有cookies信息的加上标识斜体)
❤️❤️❤️以上内容如有问题,欢迎大家在评论区指正,希望大家能够互相学习;码字不易,如果您喜欢此分享,记得点赞,收藏哦,谢谢。❤️❤️❤️