Fiddler工具使用介绍

Fiddler工具使用介绍

注:本文内容借鉴于其他多篇博客

Fiddler基础知识

  • Fiddler是强大的抓包工具,它的原理是以web代理服务器的形式进行工作的,使用的代理地址是:127.0.0.1,端口默认为8888,我们也可以通过设置进行修改。
  • 代理就是在客户端和服务器之间设置一道关卡,客户端先将请求数据发送出去后,代理服务器会将数据包进行拦截,代理服务器再冒充客户端发送数据到服务器;同理,服务器将响应数据返回,代理服务器也会将数据拦截,再返回给客户端。
  • Fiddler可以抓取支持http代理的任意程序的数据包,如果要抓取https会话,要先安装证书。

HTTP协议

  • 要分析Fiddler抓取的数据包,我们首先要熟悉HTTP协议。HTTP即超文本传输协议,是一个基于请求与响应模式的、无状态的、应用层的协议,绝大多数的Web开发,都是构建在HTTP协议之上的Web应用。
  • HTTP的工作过程:当我们请求一个超链接时,HTTP就开始工作了,客户端先发送一个请求到服务器,请求内容包括:协议版本号、请求地址、请求方式、请求头和请求参数;服务器收到请求后做相应的处理,并将响应数据返回到客户端,响应内容包括:协议版本号、状态码和响应数据。前端根据响应数据做相应的处理,就是最终我们看到的内容。这些过程是HTTP自动完成的,我们只是输入或点击请求地址,然后查看前端给我们展示的内容。
  • 请求方式常用的有:GET、PUT、POST、DELETE。
  • HTTP状态码主要分为5类:以1开头的代表请求已被接受,需要继续处理;以2开头的代表请求已成功被服务器接收、理解、并接受;以3开头的代表需要客户端采取进一步的操作才能完成请求;以4开头的代表了客户端看起来可能发生了错误,妨碍了服务器的处理;以5开头的代表了服务器在处理请求的过程中有错误或者异常状态发生,也有可能是服务器意识到以当前的软硬件资源无法完成对请求的处理。
  • 常见的主要有:200:服务器成功处理了请求;404:未找到资源;500:内部服务器错误;503:服务器目前无法为请求提供服务;302:请求的URL已临时转移;304:客户端的缓存资源是最新的,要客户端使用缓存。
  • 更多关于HTTP协议的介绍请参考HTTP详解。

Fiddler的使用

  • Fiddler是一个很好用的抓包工具,可以将网络传输发送与接收的数据包进行截获、重发、编辑等操作。也可以用来检测流量。
  • Fiddler安装后,设置的端口默认为8888,当Fiddler启动后,默认将IE的代理设为了127.0.0.1:8888。当你关闭的时候,它又帮你把代理还原。而其他如火狐浏览器需要手动设置代理后才可以抓包。设置内容如图:
image

1、开启Capture Traffic

要使用Fiddler进行抓包,首先需要确保Capture Traffic是开启的(安装后是默认开启的),勾选File->Capture Traffic,也可以直接点击Fiddler界面左下角的图标开启和关闭抓包。

img

2、数据包列表各字段的含义

所以基本上不需要做什么配置,安装后就可以进行抓包了。那么我们怎么分析抓到的这些数据包呢?如图所示的区域为数据包列表,要分析这些数据包,首先要了解各字段的含义。

img

名称 含义
# 顺序号,抓取HTTP Request的顺序,从1开始,以此递增
Result HTTP状态码
Protocol 请求使用的协议,如HTTP/HTTPS/FTP等
Host 请求地址的主机名
URL 请求资源的位置
Body 该请求的大小
Caching 请求的缓存过期时间或者缓存控制值
Content-Type 请求响应的类型
Process 发送此请求的进程:进程ID
Comments 允许用户为此回话添加备注
Custom 允许用户设置自定义值

2.1、顺序号中各图标含义

图标 含义
clip_image001[13] 请求已经发往服务器
clip_image002[4] 已从服务器下载响应结果
clip_image003[4] 请求从断点处暂停
clip_image004[4] 响应从断点处暂停
clip_image005[4] 请求使用 HTTP 的 HEAD 方法,即响应没有内容(Body)
clip_image006[4] 请求使用 HTTP 的 POST 方法
clip_image007[4] 请求使用 HTTP 的 CONNECT 方法,使用 HTTPS 协议建立连接隧道
clip_image008[4] 响应是 HTML 格式
clip_image009[4] 响应是一张图片
clip_image010[4] 响应是脚本格式
clip_image011[4] 响应是 CSS 格式
clip_image012[4] 响应是 XML 格式
clip_image013[4] 响应是 JSON 格式
clip_image014[4] 响应是一个音频文件
clip_image015[4] 响应是一个视频文件
clip_image016[4] 响应是一个 SilverLight
clip_image017[4] 响应是一个 FLASH
clip_image018[4] 响应是一个字体
clip_image019[4] 普通响应成功
clip_image020[4] 响应是 HTTP/300、301、302、303 或 307 重定向
clip_image021[4] 响应是 HTTP/304(无变更):使用缓存文件
clip_image022[4] 响应需要客户端证书验证
clip_image023[4] 服务端错误
clip_image0244 会话被客户端、Fiddler 或者服务端终止

2.2、Result状态码列表

状态码 状态码英文名称 中文描述
100 Continue 继续。客户端应继续其请求
101 Switching Protocols 切换协议。服务器根据客户端的请求切换协议。只能切换到更高级的协议,例如,切换到HTTP的新版本协议
200 OK 请求成功。一般用于GET与POST请求
201 Created 已创建。成功请求并创建了新的资源
202 Accepted 已接受。已经接受请求,但未处理完成
203 Non-Authoritative Information 非授权信息。请求成功。但返回的meta信息不在原始的服务器,而是一个副本
204 No Content 无内容。服务器成功处理,但未返回内容。在未更新网页的情况下,可确保浏览器继续显示当前文档
205 Reset Content 重置内容。服务器处理成功,用户终端(例如:浏览器)应重置文档视图。可通过此返回码清除浏览器的表单域
206 Partial Content 部分内容。服务器成功处理了部分GET请求
300 Multiple Choices 多种选择。请求的资源可包括多个位置,相应可返回一个资源特征与地址的列表用于用户终端(例如:浏览器)选择
301 Moved Permanently 永久移动。请求的资源已被永久的移动到新URI,返回信息会包括新的URI,浏览器会自动定向到新URI。今后任何新的请求都应使用新的URI代替
302 Found 临时移动。与301类似。但资源只是临时被移动。客户端应继续使用原有URI
303 See Other 查看其它地址。与301类似。使用GET和POST请求查看
304 Not Modified 未修改。所请求的资源未修改,服务器返回此状态码时,不会返回任何资源。客户端通常会缓存访问过的资源,通过提供一个头信息指出客户端希望只返回在指定日期之后修改的资源
305 Use Proxy 使用代理。所请求的资源必须通过代理访问
306 Unused 已经被废弃的HTTP状态码
307 Temporary Redirect 临时重定向。与302类似。使用GET请求重定向
400 Bad Request 客户端请求的语法错误,服务器无法理解
401 Unauthorized 请求要求用户的身份认证
402 Payment Required 保留,将来使用
403 Forbidden 服务器理解请求客户端的请求,但是拒绝执行此请求
404 Not Found 服务器无法根据客户端的请求找到资源(网页)。通过此代码,网站设计人员可设置"您所请求的资源无法找到"的个性页面
405 Method Not Allowed 客户端请求中的方法被禁止
406 Not Acceptable 服务器无法根据客户端请求的内容特性完成请求
407 Proxy Authentication Required 请求要求代理的身份认证,与401类似,但请求者应当使用代理进行授权
408 Request Time-out 服务器等待客户端发送的请求时间过长,超时
409 Conflict 服务器完成客户端的 PUT 请求时可能返回此代码,服务器处理请求时发生了冲突
410 Gone 客户端请求的资源已经不存在。410不同于404,如果资源以前有现在被永久删除了可使用410代码,网站设计人员可通过301代码指定资源的新位置
411 Length Required 服务器无法处理客户端发送的不带Content-Length的请求信息
412 Precondition Failed 客户端请求信息的先决条件错误
413 Request Entity Too Large 由于请求的实体过大,服务器无法处理,因此拒绝请求。为防止客户端的连续请求,服务器可能会关闭连接。如果只是服务器暂时无法处理,则会包含一个Retry-After的响应信息
414 Request-URI Too Large 请求的URI过长(URI通常为网址),服务器无法处理
415 Unsupported Media Type 服务器无法处理请求附带的媒体格式
416 Requested range not satisfiable 客户端请求的范围无效
417 Expectation Failed 服务器无法满足Expect的请求头信息
500 Internal Server Error 服务器内部错误,无法完成请求
501 Not Implemented 服务器不支持请求的功能,无法完成请求
502 Bad Gateway 作为网关或者代理工作的服务器尝试执行请求时,从远程服务器接收到了一个无效的响应
503 Service Unavailable 由于超载或系统维护,服务器暂时的无法处理客户端的请求。延时的长度可包含在服务器的Retry-After头信息中
504 Gateway Time-out 充当网关或代理的服务器,未及时从远端服务器获取请求
505 HTTP Version not supported 服务器不支持请求的HTTP协议的版本,无法完成处理

3、各数据包详细内容

3.1、Statistics 请求的性能数据分析

随意点击一个请求,就可以看到Statistics关于HTTP请求的性能以及数据分析了(不可能安装好了Fiddler一条请求都没有…):

image-20210117131515898

注:Show Chat是以饼状图展示headers和octet-stream的比列

3.2、Inspectors 查看数据内容

Inspectors是用于查看会话的内容,上半部分是请求的内容,下半部分是响应的内容:

img

3.2.1、header(头文件)

详情见HTTP详解

(1)、HTTP Request Header(HTTP请求头)

以百度为例,查看请求百度主页这条数据包的请求数据,从上面的Headers中可以看到如下内容:

img

请求方式:GET

协议: HTTP/1.1

Client 头域:

Accept: text/html, application/xhtml+xml, image/jxr, / ---------浏览器端可以接受的媒体类型
Accept-Encoding: gzip, deflate ---------压缩方法
Accept-Language: zh-CN ---------语言类型
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/51.0.2704.79 Safari/537.36 Edge/14.14393 ---------客户端使用的操作系统和浏览器的名称和版本

COOKIE头域:将cookie值发送给服务器

Transport 头域:

Connection:当网页打开完成后,客户端和服务器之间用于传输HTTP数据的TCP连接是否关闭。keep-alive表示不会关闭,客户端再次访问这个服务器上的网页,会继续使用这一条已经建立的连接;close表示关闭,客户端再次访问这个服务器上的网页,需要重新建立连接。
HOST:主机名或域名,若没有指定端口,表示使用默认端口80.

(2)、HTTP Response Header(HTTP响应头)

继续以百度为例,如图所示:

img

协议:HTTP/1.1

状态码:200

Cache头域:
Cache-Control: private ---------此响应消息不能被共享缓存处理,对于其他用户的请求无效
Date: Sat, 05 Aug 2017 04:37:43 GMT ---------生成消息的具体时间和日期
Expires: Sat, 05 Aug 2017 04:37:42 GMT ---------浏览器会在指定过期时间内使用本地缓存

Cookie/Login 头域:

Set-Cookie: BDSVRTM=264; path=/ ---------把cookie发送到客户端
Set-Cookie: BD_HOME=1; path=/
Set-Cookie: H_PS_PSSID=1425_21097_22157; path=/; domain=.baidu.com

Entity头域

Content-Length: 202740 ---------正文长度
Content-Type: text/html;charset=utf-8 ---------告知客户端服务器本身响应的对象的类型和字符集

Miscellaneous 头域:
Bdpagetype: 2
Bdqid: 0x99791efd00036253
Bduserid: 2577220064
Server: BWS/1.1 ---------指明HTTP服务器的软件信息
X-Ua-Compatible: IE=Edge,chrome=1

Security头域:
Strict-Transport-Security: max-age=172800 ---------基于安全考虑而需要发送的参数,关于这个参数的解释,请参考:http://www.freebuf.com/articles/web/66827.html

Transport头域:

Connection: Keep-Alive

3.2.2、TextView:显示请求或响应的数据
3.2.3、SyntaxView:显示主机的ip地址

如果syntaxview窗口出现乱码,只需再fiddler界面GO往右第二个Decode点击一下,让他出现蓝色边框即可
img

注意`:抓取前的他不会进行自动解码,要再重新刷新页面才能获取`界面后的内容
3.2.4、WebForms:请求部分以表单形式显示所有的请求参数和参数值;响应部分与TextView内容是一样的
3.2.5、HexView:以十六进制显示请求或响应的数据
3.2.5、Auth:显示认证信息,如Authorization
3.2.6、Cookies:显示所有cookies
3.2.6、Raw:显示Headers和Body数据
3.2.7、JSON:若请求或响应数据是json格式,以json形式显示请求或响应内容
3.2.8、XML:若请求或响应数据是xml格式,以xml形式显示请求或响应内容
3.2.9、POST请求

上面是以百度主页为例,百度主页采用的是GET请求,在TextView中没有请求body,我们再以无忧行网站登录接口为例,它是一个POST请求,除了请求头外,在TextView中多了请求数据。这也是GET请求和POST请求的一个区别。GET请求是将请求参数放在url中,而POST请求一般是将请求参数放在请求body中。

img

img

总结:通过Fiddler可以抓取请求和响应参数,通过对参数进行分析,可以定位是前端还是后台问题。例如我们在测试登录接口时,输入了正确的手机号和密码,但前端提示“请输入正确的用户名和密码”;仅仅通过界面提示我们只能描述bug表象,但不能分析出问题原因。假设通过抓包我们发现是由于前端参数名错误或参数值为空,从而导致后台报错。这个时候我们将bug指向前端开发人员,并将参数数据和接口文档中对应的报文数据作为附件上传,是不是可以提高bug的解决效率呢?Fiddler在实际的功能测试中有很大的作用,一方面帮助我们更好的了解某个业务中客户端和服务器端是通过哪些接口进行请求的,从而更好的了解代码逻辑;另一方面,我们还可以通过响应数据判断哪里出现了问题,例如可能服务器程序挂了,导致前端报“服务器故障”,这时我们通过抓包发现响应数据返回502,这时我们可以手动去重启服务或是联系运维重启服务,从而提高问题的解决效率。

3.3、AutoResponder 允许拦截指定规则的请求

AutoResponder允许你拦截指定规则的求情,并返回本地资源或Fiddler资源,从而代替服务器响应。用于本地js调试,接口数据测试

举例:https://www.baidu.com/
1.访问百度首页
这里写图片描述

2.用fiddler抓取请求
这里写图片描述

保存的文件:
这里写图片描述

3.开启Fiddler的请求自动重定向功能
这里写图片描述
打开AutoResponder标签设置。有没有看到界面上有两个复选框?第一个的作用是开启或禁用自动重定向功能,我们就可以在下面添加重定向规 则了。第二个复选框框勾上时,不影响那些没满足我们处理条件的请求。

4.创建重定向规则,将目标是这个js的HTTP请求重定向到本地文件
这里写图片描述
我们可以通过“Add…”按钮手动添加规则,不过这个URL已经出现在我们的session列表中,可以直接拖动过来。在左侧的Session列表 中选择第一步找到的session,拖动到AutoResponse标签中。这样就创建了一个针对这个URL的规则。

5.修改保存文件的内容,如:
这里写图片描述

6.重启fiddler,再次访问百度首页
这里写图片描述

看一下session列表,如果像下面这样,这个session的底色是灰色的,那么恭喜你,你已经成功将这个请求重定向到本地文件了!
这里写图片描述

注意:如果浏览器用的是Firefox,记得先清一下临时文件缓存,因为Firefox是真正的缓存,当判断文件的缓存还未过期时,就不会再发请求出 来,Fiddler就获取不到了。

总结:我们可以通过以上方法修改本地文件,进行测试。自动重定向功能是Fiddler最实用的功能,这里的Rule可以自由地设定,可以使用搜索(默认)、精确匹配(EXACT)、正则表达式匹 配(REGEX)。处理方式可以选择使用文件,也可以选择合适的时间暂停数据流(bpu、bpafter),人工干预。通过以上几个步骤,我们演示了 怎样将HTTP请求重定向到本地的文件,进行web调试。这种调试方式不需要发布到线上再验证,避免了修改不成功、对用户造成影响的风险,而且不需要搭建 复杂的开发服务器等开发环境,非常适合快速web调试。

这个玩意有很多匹配规则,如:

  1. 字符串匹配(默认):只要包含指定字符串(不区分大小写),全部认为是匹配
字符串匹配(baidu) 是否匹配
http://www.baidu.com 匹配
http://pan.baidu.com 匹配
http://tieba.baidu.com 匹配
  1. 正则表达式匹配:以“regex:”开头,使用正则表达式来匹配,这个是区分大小写的
字符串匹配(regex:.+.(jpg | gif | bmp ) $) 是否匹配
http://bbs.fishc.com/Path1/query=foo.bmp&bar 不匹配
http://bbs.fishc.com/Path1/query=example.gif 匹配
http://bbs.fishc.com/Path1/query=example.bmp 匹配
http://bbs.fishc.com/Path1/query=example.Gif 不匹配

3.4、Composer 自定义请求发送服务器

Composer允许自定义请求发送到服务器,可以手动创建一个新的请求,也可以在会话表中,拖拽一个现有的请求

Parsed模式下你只需要提供简单的URLS地址即可(如下图,也可以在RequestBody定制一些属性,如模拟浏览器User-Agent)

image

3.5、 Filters 请求过滤规则

Fiters 是过滤请求用的,左边的窗口不断的更新,当你想看你系统的请求的时候,你刷新一下浏览器,一大片不知道哪来请求,看着碍眼,它还一直刷新你的屏幕。这个时候通过过滤规则来过滤掉那些不想看到的请求。

3.5.1、勾选Use Filters复选框

首先打开Fiddler主界面,查看右侧功能区选择Filfters标签,勾选Use Filters复选框;

在这里插入图片描述

3.5.2、Hosts配置

Fiddler默认是会拦截所有的数据包,我们在本地开发时希望只过滤本地开发环境(只拦截本地PHP开发环境的地址http://localhost:8083,方便调试)的地址如何做?
选择内网Show only Intranet Hosts只过滤内部IP的

在这里插入图片描述
相对应的还有只过滤外网的IP Show only internet Hosts
在这里插入图片描述

假设我们只过滤localhost:8083地址如何做?
打开第二个下拉框选中Show only the following Hosts 仅显示输入到下面文本框中的Hosts(IP和端口),这时我们输入一个http://localhost:8083地址和http://localhost:8084地址;
在这里插入图片描述
在Fiddler中只抓到了8083端口的地址,效果如下:
在这里插入图片描述
我们继续看第二个下拉框中还有那些选项

在这里插入图片描述

  • No Host Filter:不设置过滤主机IP条件
  • Hide the following Hosts:隐藏不过滤输入到下面文本框中的的Hosts
  • Show only the following Hosts:仅过滤显示输入到下面文本框中的Hosts
  • Flag the following Hosts:过滤出给输入到下面文本框中的Host设置标识(就是给session加粗效果)

我们选中Flag the following Hosts选项后,刷新8083端口的地址
在这里插入图片描述
抓到的session加粗了,效果如下:
在这里插入图片描述

3.5.3、Client Process客户端进程配置

(1)、先还原Host配置

在这里插入图片描述
这一部分主要是针对客户端发起的请求过滤

在这里插入图片描述

  • Show only traffic from 仅显示来自选择的通道
  • Show only Internet Explorer traffic 仅显示来自IE通道
  • Hide traffic from Service Host 隐藏来自服务主机的Host

例如:演示Show only traffic from

首先我们在浏览器里输入一个京东商城https://www.jd.com后,在Fiddler中选中session后,按住Shift+Delete删除未选中的session,只保留这一条方便查看;

在这里插入图片描述
我们看到了Process(chrome:1984)这一字段,我们去(Show only traffic from)下拉框中查看它:
在这里插入图片描述

按住Ctrl+X删除所有session会话,刷新京东商城官网和去ie或火狐浏览器下打开百度首页,只是过滤chrome:1984的session。

3.5.4、Request Header 请求首页过滤配置

在这里插入图片描述

  • Show only if URL contains:仅仅显示URL中包含的字符串(字符串可以URL中一部分,多部分用空格分开, 可以是正则或完整的URL)
  • Hide if URL contains:仅仅隐藏URL中包含的字符串(字符串可以URL中一部分,多部分用空格分开, 可以是正则或完整的URL)
  • Flag requests with headers:匹配请求Header包含的字段设置Flag(打一个标签加粗)
  • Delete request headers:删除请求中的Header字段
  • Set request Header:请求中添加首页字段

例如:演示请求Header中包含Cookie首部的加上标记,也就是加粗
在这里插入图片描述
效果如下,加粗的是加上了Flag requests with headers

在这里插入图片描述

3.5.5、Breakpoints设置断点

在这里插入图片描述

  • Break request on Post:针对Post请求设置断点
  • Break request on GET with query string:针对Get请求设置断点
  • Break on XMLHttpRequest:针对Ajax请求设置断点
  • Break response on Content-type:针对响应报文中首部字段Content-Type匹配成功的session设置断点

例如:修改京东商城官网Title为“京东商城360”

首先我们结合前面讲过的过滤选项配合达到过滤京东商城官网
经过分析www.jd.com页面中大部分资源都是二级域名,1)所以我们很好匹配,只显示匹配的域名, 2)轻松的设置一下Content-Type: text/html

在这里插入图片描述
我们刷新一下京东商城页面,在Fiddler中看到以下效果
在这里插入图片描述
有一个红方块,表示过滤并设置断点成功,双击一下看到如下效果:
在这里插入图片描述
京东(JD.COM)-正品低价、品质保障、配送及时、轻松购物!修改成京东商城360后,看到有一个绿色的按钮,点一下它,回到浏览器看title已经修改了

效果对比:
修改前:
在这里插入图片描述
修改后:
在这里插入图片描述

3.5.6、Response Status Code 响应状态码

在这里插入图片描述

  • Hide success(200):隐藏200状态码
  • Hide non-2xx:隐藏不是2xx开头的状态码
  • Hide Authentication demands(401,407):隐藏认证的(401 407)状态码
  • Hide redirects(300, 301, 302, 303,307):隐藏重定向(300 301 302 303 307)状态码
  • Hide Not Modifield(304):隐藏不是缓存(304)的状态码(?这里有疑问,选中后,结果隐藏了304,请求指导)
3.5.7、Response Type and Size 响应类型和报文大小

在这里插入图片描述
下拉框过滤条件

在这里插入图片描述

  • 下拉框过滤条件

    • Show all Content-Type:显示所有类型的Content-Type
    • Show only IMAGE/*:仅显示图片
    • Show only HTML:仅显示HTML
    • Show only TEXT/CSS:仅显示CSS
    • Show only SCRIPTS:仅显示SCRIPTS
    • Show only XML:仅显示XML
    • Show only JSON:仅显示JSON
    • Hide IMAGE/*:隐藏图片
  • Hide smaller than:隐藏小于指定大小的响应实体

  • Hide larger than:隐藏大于指定大小的响应实体

  • Time HeatMap:时间的热图

  • Block script files:阻止返回正常JS文件

  • Block image files:阻止返回正常图片文件

  • Block SWF files:阻止返回正常SWF文件

  • Block CSS files:阻止返回正常CSS文件

例如:演示这个功能可以测试CSS加载失败的情况下HTML语义化结构

3.5.8、Response Header响应首页字段

在这里插入图片描述

  • Flag responses that set cookies:响应中首页字段有cookies的加上标识(斜体)
  • Flag responses with headers:匹配的响应首页字段加上标识(加粗)
  • Delete response headers:删除响应首页字段
  • Set response header:增加响应首部字段

3.6、Timeline 请求响应时间

3.6.1、TimeLine选项卡介绍

TimeLine选项卡支持使用"瀑布"模型查看1~250个选中的Session。主要用于帮助性能分析和理解请求之间的关联。选项卡的主体内容是数据流视图,页面的上方是标题,显示时间轴模式,默认情况下是"传输时间轴"。

img

鼠标右键:

  • AutoScale Chart:如果选中该选项,会水平调节图形宽度,使得整个图形适配选项卡宽度,不需要水平滚动条
  • Copy Chart:点击该选项会将图形以位图格式拷贝到剪切板
  • Mode(dropdown)
    • Timeline:通过时间轴线条显示每个Session,用彩色条表示时间
    • Client Pipe Map:显示每个时间轴的客户端进程和Fiddler之间的连接,多个Session之间重用的连接会以多种彩色条显示
    • Server Pipe Map:显示每个时间轴的Fiddler和上游服务器之间的连接,多个Session之间的重用的连接会以多种彩色显示
3.6.2、模式:TimeLine(时间轴)
  • 时间轴模式下,每行显示一个Session。
  • 时间轴最左边的是从URL中提取出来的文件名。
  • 鼠标放在Session上,下方的状态栏中就会显示该Session的信息。
  • 点击Session+shift键显示该Session的详细信息。
  • 条形栏更长,说明请求响应慢。
  • 条形栏的颜色由响应的MIME类型决定:
    • 浅蓝色:图像
    • 深绿色:JavaScript
    • 紫色:CSS
    • 蓝色:其他类型
3.6.3、模式:Client Pipe Map(客户端管道映射)

img

  • Client Pipe Map模式下,时间轴显示一个客户端的接入连接请求,
  • 图表的左侧是连接标识符,显示进程名称、进程ID、客户端端口号。
3.6.4、模式:Server Pipe Map(服务端管道映射)

img

  • Server Pipe Map模式下,时间轴显示Fiddler向服务器发出的连接。
  • 图表的左侧是连接标识符,表示Fiddler端的端口号和目标主机名。

设置解密HTTPS的网络数据

Fiddler可以通过伪造CA证书来欺骗浏览器和服务器。Fiddler是个很会装逼的好东西,大概原理就是在浏览器面前Fiddler伪装成一个HTTPS服务器,而在真正的HTTPS服务器面前Fiddler又装成浏览器,从而实现解密HTTPS数据包的目的。

解密HTTPS需要手动开启,依次点击:

1、Tools –> Fiddler Options –> HTTPS

image

2、 勾选Decrypt HTTPS Traffic

image

3、点击OK

image

Fiddler 抓取Iphone / Android数据包

想要Fiddler抓取移动端设备的数据包,其实很简单,先来说说移动设备怎么去访问网络,看了下面这张图,就明白了。

image

可以看得出,移动端的数据包,都是要走wifi出去,所以我们可以把自己的电脑开启热点,将手机连上电脑,Fiddler开启代理后,让这些数据通过Fiddler,Fiddler就可以抓到这些包,然后发给路由器(如图):

image

1、打开Wifi热点,让手机连上(我这里用的360wifi,其实随意一个都行)

image

2、打开Fidder,点击菜单栏中的 [Tools] –> [Fiddler Options]

image

3、 点击 [Connections] ,设置代理端口是8888, 勾选 Allow remote computers to connect, 点击OK

image

4、这时在 Fiddler 可以看到自己本机无线网卡的IP了(要是没有的话,重启Fiddler,或者可以在cmd中ipconfig找到自己的网卡IP)

image

image

5、在手机端连接PC的wifi,并且设置代理IP与端口(代理IP就是上图的IP,端口是Fiddler的代理端口8888)

image

6、访问网页输入代理IP和端口,下载Fiddler的证书,点击下图FiddlerRoot certificate

image

【注意】:如果打开浏览器碰到类似下面的报错,请打开Fiddler的证书解密模式(Fiddler 设置解密HTTPS的网络数据)

No root certificate was found. Have you enabled HTTPS traffic decryption in Fiddler yet?

208B4A022896FE5008CFDBD54105185D 13D99A1D77D5528F3EFBA0C3DEA3BD28

FDE79CDC9CB62CC6CF68F98C33CB281A 8F268C0A1192E2DF41BD0F5DEFD525D9

7、安装完了证书,可以用手机访问应用,就可以看到截取到的数据包了。(下图选中是布卡漫画的数据包,下面还有QQ邮箱的)

image

Fiddler 内置命令

Fiddler还有一个藏的很深的命令框,就是眼前,我用了几年的Fiddler都没有发现它,偶尔在别人的文章发现还有这个小功能,还蛮好用的,整理下记录在这里。

FIddler断点功能就是将请求截获下来,但是不发送,这个时候你可以干很多事情,比如说,把包改了,再发送给服务器君。还有balabala一大堆的事情可以做,就不举例子了。

image

1、Fiddler内置命令

命令 对应请求项 介绍 示例
? All 问号后边跟一个字符串,可以匹配出包含这个字符串的请求 ?google
> Body 大于号后面跟一个数字,可以匹配出请求大小,大于这个数字请求 >1000
< Body 小于号跟大于号相反,匹配出请求大小,小于这个数字的请求 <100
= Result 等于号后面跟数字,可以匹配HTTP返回码 =200
@ Host @后面跟Host,可以匹配域名 @www.baidu.com
select Content-Type select后面跟响应类型,可以匹配到相关的类型 select image
cls All 清空当前所有请求 cls
dump All 将所有请求打包成saz压缩包,保存到“我的文档\Fiddler2\Captures”目录下 dump
start All 开始监听请求 start
stop All 停止监听请求 stop

2、断点命令

命令 对应请求项 介绍 示例
bpafter All bpafter后边跟一个字符串,表示中断所有包含该字符串的请求 bpafter baidu(输入bpafter解除断点)
bpu All 跟bpafter差不多,只不过这个是收到请求了,中断响应 bpu baidu(输入bpu解除断点)
bps Result 后面跟状态吗,表示中断所有是这个状态码的请求 bps 200(输入bps解除断点)
bpv / bpm HTTP方法 只中断HTTP方法的命令,HTTP方法如POST、GET bpv get(输入bpv解除断点)
g / go All 放行所有中断下来的请求 g

3、示例演示

?

image

>

image

<

image

=

image

@

image

select

image

cls

image

dump

image

断点命令:

断点可以直接点击Fiddler下图的图标位置,就可以设置全部请求的断点,断点的命令可以精确设置需要截获那些请求。如下示例:

image

命令:

bpafter

image image

bps

image

image

bpv

image

image

g / go

image

image

断点

1、对request设置断点

1.1、通过菜单选项或快捷键F11进行设置

如图:

img

当我们设置断点后,进行HTTP请求,数据包顺序列会有中断的标记,单击该数据包可以看到在右侧会增加一行操作栏。这个时候我们在前端是没有正常加载网页的,点击【Run to Completion】后可以返回响应数据。

img

接下来为了看我们的断点设置是否生效,我们以登录为例子进行测试。登录无忧行网站,输入正确的用户名和密码,点击登录。我们断点规则设置为before request,然后将密码清空,看看服务器给我们返回了什么响应数据。

img

img

img

继续以登录为例子,这次我们将手机号改成非移动账号进行登录。

img

img

img

由此可见,我们的断点已经设置成功,并且成功修改了HTTP的请求数据。

1.2、命令行操作

通过菜单选项或快捷键进行设置时,会将所有的HTTP请求都设置断点,但有时我们只想针对某个服务器发出的请求设置断点,应该怎么操作呢?Fiddler是支持命令操作的,我们可以通过“bpu 服务器地址”命令来对特定的请求设置断点。

在下图所示的位置输入命令,然后回车运行。

img

这个时候从该服务器发出的所有请求都会被中断,而从其他服务器发出的请求可以正常响应。

img

如果要清除原来的断点,可以在命令行输入“bpu”,就会清除所有的断点。

2、对response设置断点

2.1、通过菜单选项或快捷键alt+F11进行设置

img

2.2、通过命令“bpafter 服务器地址”

我们也用一个实例来验证通过设置断点修改响应数据。以百度主页为例,我们拦截到响应数据中的title值为”百度一下,你就知道“,我们将响应数据中的title改成”test百度一下,你就知道“,然后在前端看看最终展示的是什么数据。

img

img

img

通过几个实例,更好的帮助我们理解断点的含义,也巩固了Fiddler作为代理服务器的概念。接下来我们再来说说,Fiddler另一个很实用的功能:Fiddler的编码和解码。

编码和解码

1、响应body解码

有时候我们在Fiddler上看到响应数据是几个乱码字符,首先我们可以点击,上方黄色提示区域直接进行解码。如下面的两个图所示。

img

img

2、请求和响应数据解码

有的时候,基于安全性考虑,开发人员会将请求和响应的body根据一定规则进行解码。如果是普通的编码规则,我们可以直接通过Fiddler操作进行解码。例如在登录百度网站的时候,有个参数的值是一个url地址,这个url经过urlEncode进行转码了。我们就可以将该参数通过urlDecode进行解码。

img

首先,找到这个参数,选中后右键选择【send to TextWizard】

img

然后,在【transform】中找到【URLDecode】,字段值就被成功解码,我们就可以很清楚的看到里面有哪些参数以及参数的值是什么了。

img

会话比较功能

 选中2个会话,右键然后点击Compare,就可以用WinDiff来比较两个会话的不同了(注:需要安装WinDiff,自行百度安装就可以了,这里就不细说安装步骤),如图所示:

img

查询会话

  Edit->Find Sessions(或Ctrl+F)打开Find Sessions的对话框,输入关键字查询你要的会话。 查询到的会话会用黄色显示,如图所示:

img

保存会话

  有些时候我们需要把会话保存下来,以便发给别人或者以后去分析。 保存会话的步骤如下:File->Save->Selected Sessions

script系统

  首先先安装SyntaxView插件,Inspectors tab->Get SyntaxView tab->Download and Install SyntaxView Now... 如图所示:

img

  安装成功后Fiddler 就会多了一个Fiddler Script tab,如图所示:

img

  在里面我们就可以编写脚本了, 看个实例让所有cnblogs的会话都显示红色。

  把这段脚本放在OnBeforeRequest(oSession: Session) 方法下,并且点击"Save script"

if (oSession.HostnameIs("www.cnblogs.com")) {
  oSession["ui-color"] = "red";
}

  这样所有的cnblogs的会话都会显示红色。

在VS调试网站的时候使用Fiddler

  我们在用visual stuido 开发ASP.NET网站的时候也需要用Fiddler来分析HTTP, 默认的时候Fiddler是不能嗅探到localhost的网站。不过只要在localhost后面加个点号,Fiddler就能嗅探到。

  例如:原本ASP.NET的地址是 http://localhost:9999/Default.aspx, 加个点号后,变成 http://localhost.:9999/Default.aspx 就可以了

posted @ 2021-04-01 15:41  昵称已经被使用  阅读(1172)  评论(0)    收藏  举报