2022最新版🚀Fiddler抓包教程(5) Fiddler辅助
作者:极客小俊
公众号同名: 一个把逻辑思维转变为代码的技术博主
Fiddler辅助标签工具栏 详解
Fiddler
中辅助标签工具栏算是用得比较多的,因为经常要在这里查看抓取数据包的详细信息!
接下来我就详细拆分辅助标签工具栏
的各个区域来讲解!
Statistics 性能统计
用于查看请求的性能数据,统计与分析, 也就是说它就是对当前请求的性能分析数据
当你点击一个HTTP请求会话的时候,就可以看到Statistics
里面有关于当前HTTP请求的性能以及数据分析!
例如: 一些TCP/IP
的连接时间,DNS
的解析时间、资源消耗、各个国家的请求网络带宽对比等信息
如图
如果你是一个专业的前端开发者,这些数据就应该重点关注一下!
Inspectors 请求与响应数据查看
你有没有想过在Fiddler
中如何快速查看http请求与响应报文呢?
其实当我们在会话列表
中双击某一个会话请求
就会自动跳转到Inspectors
选项卡
也就是当抓包
成功之后, 就可以在左侧
窗口中选择你要查看的地址
来进行查看抓取的http
信息数据, 当选择了相应的地址之后,在右侧
选项卡中 选择Inspectors(检查器)
, 然后再点击一下Raw
就可以按照原生形式
来进行查看到相应的http请求报文
与http响应报文
, 分为上下两个部分,上半部分是请求头部分
,下半部分是响应头部分
。
如图
对于每一部分,提供了多种不同格式查看每个请求和响应的内容, Inspectors
选项卡中还有其他的
Inspectors
选项卡上半部分HTTP请求内容的子集选项卡
如下表
名称 | 含义 |
---|---|
Headers |
以层级的形式来显示HTTP请求头部的相关内容信息 |
TextView |
以文本的形式展示 |
SytaxView |
查看具体的请求体 或者附带的键与值 |
WebForms |
可以通过它看到url提交的相关参数信息 |
HexView |
以16进制进行查看请求! |
Auth |
查看请求数据权限 |
Cookie |
查看请求cookie 信息 |
Raw |
原生查看http |
JSON |
以JSON 格式展开查看请求信息! |
XML |
以xml 格式展开查看请求信息! |
Inspectors
选项卡下半部分HTTP响应内容 的子集选项卡
如下表
名称 | 含义 |
---|---|
Transformer |
|
Headers |
以层级 方式来展示HTTP响应头部 信息 |
TextView |
以文本 方式来展示HTTP响应正文 信息 |
SyntaxView |
以语法高亮 来展示HTTP响应正文 信息 |
ImageView |
以图片的形式 来展示响应信息, 前提是你选择的会话是一个图片响应 |
HexView |
以16进制 来查看响应信息 |
Webview |
以html编译显示之后 的形式来查看响应结果 |
Auth |
查看响应权限 |
Caching |
查看响应缓存相关信息 |
cookie |
查看响应cookie 信息 |
Raw |
以原生格式 展示响应信息 |
JSON |
以json 展示响应信息 |
xml |
以xml 展示响应信息 |
AutoResponder 自动拦截请求
AutoResponder
也叫做自动响应器
它允许你拦截
指定规则的请求,并把响应
结果重定向
到一个本地资源 或 直接使用Fiddler
内置的资源,从而代替服务器来自定义一个你想要的响应
。 说白一点就是篡改响应
这个功能在我们做开发测试的时候也是非常有用的 ,使用它我们可以不影响用户体验的前提下进行测试!
举个例子🍐
当我们请求百度页面的时候, 抓取到其中一个百度logo图片会话
,最后把这个图片会话
响应给替换成其他资源!
首先我们可以在Fiddler
中的Inspectors
结合会话列表
找到这个图片的连接资源URL地址: 可能有多个
例如
然后切换到AutoResponder选项卡
, 在Rule Editor
规则编辑中填入要请求的资源地址
和替换成的响应
,最后点击save
保存一下, 就可以了!
温馨提醒
最好要把以下这3个复选框勾上!🙂
Enable Rules(启用规则)
Accept all connects(接受所有连接)
Unmatched requests passthrough(不匹配的请求传递)
如图
那么下一次你再次请求百度页面的时候,如果再次遇见到这个百度logo图片的资源地址,那么请求就会被中间层的Fiddler
所劫持
并篡改
成为我们设置的某个响应资源,并返回给客户端, 明白了吧, 这个响应不是从服务器回来的,而是我们人为篡改
的!
注意
测试的时候,最好使用去缓存刷新来测试, 浏览器快捷键shift+F5
效果如图
Fiddler
其实还有很多内置的响应规则,根据实际情况和需求来决定如何测试
如图
我们还可以自定义编辑响应
也就是Edit Response
举个例子🍐
我们可以直接编辑服务器
返回响应信息的详细内容,然后再返回给客户端
如图
效果如下
响应都可以随便篡改 Fiddler
还有什么事情不能做的!😁😁
总之通过这种中间截获
的手段并篡改响应资源的手法就可以实现很多资源响应的修改,你也可以修改html、css、js
等资源都是可以的 ,这极大方便了我们做开发模拟请求和响应测试!😄😄
Composer 设计请求发送到服务器
它可以允许我们自定义请求报文
来发送到服务端
,当然也可以手动创建一个新的请求,也可以从会话列表
中拖拽一个现有的请求去发送!
在Parsed(解析模式)
下我们只需要提供简单的URL
地址就可以了, 并且还可以在RequestBody
中去定制一些属性,例如模拟浏览器消息头User-Agent
但是Composer
通常在我们开发项目当中用于接口测试
也是经常用于测试一些api接口
的最好方法!
当然有时候也可以通过Composer
来校验后端接口的严谨,从而跳过一些前端的限制,去直接访问后端代码的逻辑!
Composer
下还有几个子集选项卡:Parsed、Raw、Scratchpad、Options
具体解释如下表:
选项卡 | 描述 |
---|---|
Parsed |
表示已经被解析的整个HTTP请求,包括请求行,请求头和请求体,说通俗一点也就是最直观的看到Request请求 的详细展示 |
Raw |
按照真实原生HTTP 请求标准来进行展示的格式! |
Scratchpad |
可以存储已经收集好的HTTP请求,可存储多个不同的请求, 你可以理解为请求回放功能, 鼠标连续点击三次即可选中要选择的请求来进行发送! |
Options |
设置一些请求选项 |
其中options
中的设置项如下表:
名称 | 描述 |
---|---|
Inspect Session | 检查会话,当开启此功能并重放的时候,会自动跳入Inspectors功能模块,进行检查HTTP请求和响应。 |
Fix Content-Length header | 当使用POST请求进行重放的时候,如果没有Content-Length的请求头,Fiddler会自动加上此请求头,如果有但是请求正文大小错误,则它会自动修正。默认勾选。 |
Follow Redirects | 会自动重定向301,302的请求。 |
Automatically Authenticate | 自动进行身份认证,包括认证NTLM,http 401,http 407 |
UI Options | 此功能是在原有的Fiddler功能选项里面,将Composer这个功能弹出一个浮动窗口,如果不需要直接关闭这个窗口就会恢复原样。 |
.................................................. |
我们用得最多的也就是Parsed(详细展示请求结构)
如图
举个例子🍐
我们用图灵机器人来测试一个POST请求
的智能聊天对话接口!
图灵机器人接口信息
接口信息 | 描述 |
---|---|
http://openapi.turingapi.com/openapi/api/v2 | 接口地址 |
请求方式 | HTTP POST |
请求参数 | 请求参数格式为 JSON |
参数格式
{
"perception": {
"inputText": {
"text": "聊天文字"
},
},
"userInfo": {
"apiKey": "申请的key",
"userId": "随机32位字符串"
}
}
文档说明
https://www.kancloud.cn/turing/www-tuling123-com/718227
操作流程
那么使用Fiddler
调试一个POST请求
并带有json
格式的数据,我们可以打开Composer面板
, 在Composer
面板中的第一个下拉框中选择POST
请求方式,然后输入请求接口的地址!
在Request Headers
中也可以输入一些请求头信息,也可以不输入,它会帮你自动生成
然后在Request Body
中输入请求的JSON
数据
最后点击Execute(执行)
,若在会话列表
中看到结果返回200
表示操作成功!
如图
这个时候,我们就可以在Inspectors
里面查看到请求响应的结果了!
如图
如果返回的JSON
数据格式不清楚,其实你可以拿到一些数据格式化网站上去格式化一下就可以了
如图
再举个例子🍐
我们再请求一个GET请求
如图
这样就可以返回数据了!
以上这些都是测试的第三方接口
,如果是你自己写的api接口
也是可以这样子来测试的!
总而言之:Composer
可以帮助你去发送数据包,帮助你去做一些接口测试,帮助你去做一些平常没办法做到的一些测试!☺️
Filters 请求过滤器
Filters
本意就是过滤
的意思, 它的主要作用就是用来过滤
请求用的, 要知道有的时候 会话列表
中或存在大量的请求会话
, 那么有些时候会根据用户
的条件
进行一个会话筛选
, 也就是说通过过滤规则
来过滤掉那些不想看到的请求!
Filters
选项卡也是在我们抓包过程中使用频率非常高的,其中功能也比较多,这里我把它内部的功能逐一拆解分成7个部分来进行讲解!
如图
1.Hosts
这是Filters
对主机的过滤规则设置!
如图
我们使用Filters
的时候就必须要勾选左上角的Use Filters(选择过滤器)
开启过滤器, 勾选了之后Filters
选项卡会出现绿色对钩
, 记住这个勾选之后,过滤器才会生效
并且这里还有两个请求过滤条件:Zone和Host
Zone(区域):
下拉列表中可以选择如下:
show only Intranet Hosts(只显示局域网的请求)
show only Internet Hosts(只显示广域网的请求)
如图
那么这到底代表什么意思呢?
举个例子🍐
我们来请求baidu
试试!
如图
如果设置为了show only Intranet Hosts
那么外网的请求会话是无法获取到的,智能获取内网请求
如果设置为了show only Internet Hosts
那么相反也智能获取外网的请求,而内网的请求是无法获取到的!
平常如果我们没有其他特殊需求的情况下Zone
都被默认设置为了No Zone Filter(不用区域过滤)
注意:
各位要留意 Intranet(内网) 和 Internet(因特网)
这两个单词很多人容易搞混!
Host(主机):
下拉列表中可以选择如下:
如图
含义解释:
Hide the following Hosts(隐藏下列指定的主机的请求)
show only the following Hosts (仅显示以下指定主机的请求)
Flag the following Hosts(标记以下主机)
举个例子🍐
比如说: 我设置其中一个show only the following Hosts (仅展示以下指定主机的请求)
那么会话列表
中只会出现我所指定的主机请求会话,其他一概不显示!
注意:
这里设置之后 要点击一下Actions
中的Run Filterset now(运行过滤)
如图
另外两个根据自己需求设置就行了, 平常没特殊需求我们也是设置的No Host Filter
2.Client Process
这是对客户端进程的一些过滤设置!
如图
其中有三个复选框:
show only traffic from (仅显示当前客户端指定进程的请求)
show only Internet Explorer traffic (仅显示Internet Explorer请求)
Hide trafficfrom Service Host (对服务主机隐藏请求)
举个例子🍐
我仅显示ie浏览器
的请求会话,其他浏览器的请求会话一概不显示!
如图
看到了吧,这对某一些需求上还是有一定帮助的!
3.Request Headers
这是对请求头的一些过滤规则
如图
其中有几个复选框功能如下表:
名称 | 描述 |
---|---|
show only if URL contains |
仅展示当前URL中包含指定内容的请求会话 |
Hide if URL contains |
隐藏当前URL中包含指定内容的请求会话 |
Flag request with headers |
用头标记请求, 标记带有特定header的请求,如果在web session列表中存在该请求,会加粗显示。 例如,我想突出显示header信息中带有token字段的URL请求,即可以勾选上这项,并在后面输入:token。 |
Delete request headers |
删除请求头, 也就是说在请求的过程当中会删除指定的Header字段。我们在进行测试时非常有用,比如说去掉URL中的Content-Type信息 |
set request header |
设置请求头, 也就是说可以在请求头中自定义请求头信息,前面输入字段,后面输入值, 这就是我们可以进行自定义请求头内容 |
..................................................................... |
举个例子
例如: 勾选show only if URL contains
只会显示指定包含这个内容的 响应会话
如图
例如: 勾选set request header
然后我们自定义一个header头信息
然后去发送一个请求
如图
然后我们可以在Inspectors
中查看到请求头就有我们所自定义
的头信息
了, 有的时候做一些特殊调试还是能够起很大帮助的!
如图
4.Breakpionts 断点设置
这个功能有的时候也非常重要!
功能解释如下表:
功能 | 描述 |
---|---|
Break request on Post |
针对所有POST请求设置断点。 |
Break request on GET with query string |
给所有带参数的 GET 请求设置断点 |
Break on XMLHttpRequest |
针对所有Ajax请求设置断点。 |
Break response on Content-type |
针对响应报文中header字段中,Content-Type属性匹配成功的请求设置断点 |
.............................................................................................. |
关于请求断点
后面单独拿一章节来说!
5.Response Status Code(请求状态码过滤)
这一部分的功能,很简单就是看状态码
进行会话的过滤
如图
功能解释如下表:
功能 | 描述 |
---|---|
Hide success(2xx) |
隐藏响应状态码为2xx的URL请求,如:响应状态码为200的URL请求将隐藏掉 |
Hide non-2xx |
隐藏响应状态码不是2xx的URL请求。 |
Hide Authentication demands(401,407) |
隐藏认证(响应状态码为:401 407)的URL 请求。这些响应需要用户进一步确认证书,authentication demands是认证需求的意思。 |
Hide redirects(300,301,302,303,307) |
隐藏重定向(响应状态码为:300,301,302,303,07)的URL请求。 |
Hide Not Modifield(304) |
隐藏不是缓存的状态码(304)的URL请求, 因为304是请求的资源从上次起没有发生变更返回的状态码。 |
............................................................................................. |
举个例子
我们勾选Hide success(2xx)
返回的请求会话中是不会包含2xx
状态码的请求
6.Response Type and Size (根据响应类型和大小进行过滤)
如图
Show all Content-Type
这一项比较常用, 意思为显示所有指定Content-Type类型的请求
其中的选项描述如下表:
功能 | 描述 |
---|---|
Show only IMAGE/* |
仅显示响应类型为图片的请求, 即响应header中Content-Type=IMAGE/的请求,*为通配符 |
Show only HTML |
仅显示响应类型为HTML 的请求。 |
Show only TEXT/CSS |
仅显示响应类型为text/css 的请求。 |
Show only SCRIPTS |
仅显示响应类型为Scripts 的请求 |
Show only XML |
仅显示响应类型为XML 的请求。 |
Show only JSON |
仅显示响应类型为json 的请求。 |
Hide IMAGE/* |
隐藏所有响应类型为图片的请求。 |
.............................................. |
其他功能项如下表
功能 | 描述 |
---|---|
Hide smaller than |
隐藏小于指定大小响应结果的请求,大小可以在 Inpsectors 中响应结果部分的 Transformer 中查看 |
Hide larger than |
隐藏大于指定大小响应结果的请求 |
Time HeatMap |
时间的热图。 |
Block script files |
阻止返回正常JS文件。如果响应是脚本文件,那么响应 404。 |
Block image files |
阻止返回正常图片文件。如果响应是图片文件,那么响应 404 |
Block SWF files |
阻止返回正常SWF文件。如果响应是SWF 文件,那么响应 404。 科普一下swf(shock wave flash) :是Macromedia公司的 目前已被adobe公司收购)公司的动画设计软件Flash的专用格式 |
Block CSS files |
阻止返回正常CSS文件。如果响应是 CSS 文件,那么响应 404 |
.............................................. |
举个例子
比如我们禁止掉页面上的css js 等资源看看请求的结果是什么样子的!
如图
效果
那么此时请求的页面将会失去css 、js、图片
等资源, 让他们都响应为404
状态
以上这些功能可以测试一些资源等加载失败的情况下页面的展示情况, 前端必备哦!
7.Response Header (根据响应头信息进行过滤)
如图
功能详解如下表:
功能 | 描述 |
---|---|
Flag responses that set cookies |
会话列表的响应中有cookies信息的加上标识斜体 |
Flag responses with headers |
会话列表里标记响应中带有特定header的请求 即加粗。 |
Delete response headers |
会话列表里删除响应信息中,就是说没有发给客户端之前就把这些响应头删除掉! |
Set response header |
在响应中添加header字段, 也就是自定义响应头信息,再发给客户端 |
............................................................................ |
小结 有些新手朋友在使用Fiddler的时候出现抓包失灵的情况,可能就是你在Filters选项卡中勾选了什么东西才导致的! 所以使用过滤器要注意一下!
如果我的博客对你有帮助、如果你喜欢我的博客内容,请 “👍点赞” “✍️评论” “💙收藏”
一键三连哦!
如果以上内容有任何错误或者不准确的地方,🤝🤝欢迎在下面 👇 留个言指出、或者你有更好的想法,欢迎一起交流学习❤️❤️❤️❤️❤️