导航
导航
文章目录󰁋
  1. 一、Fiddler简介
  2. 二、HTTP请求图标说明
  3. 三、Statistic
  4. 四、Inspectors
  5. 五、Composer
  6. 六、fiddler过滤会话
  7. 七、Response乱码时的处理方法
  8. 八、反向代理-AutoResponder
  9. 九、fiddler提供了一个功能,让我们模拟低速网路环境
  10. 十、直接在fiddler上配置host
  11. 十一、Fiddler显示请求服务器的ip及系统环境的配置方法
  12. 十二、fiddler断点调试
  13. 十三、配合SwitchySharp插件使用

关注作者公众号

和万千小伙伴一起学习

公众号:前端进价之旅

使用Fiddler做抓包分析

一、Fiddler简介

Fiddler是位于客户端和服务器端的HTTP代理,也是目前最常用的http抓包工具之一 。 它能够记录客户端和服务器之间的所有 HTTP请求,可以针对特定的HTTP请求,分析请求数据、设置断点、调试web应用、修改请求的数据,甚至可以修改服务器返回的数据,功能非常强大,是web调试的利器

  • 客户端的所有请求都要先经过Fiddler,然后转发到相应的服务器,反之,服务器端的所有响应,也都会先经过Fiddler然后发送到客户端
  • 使用了Fiddler之后,web客户端和服务器的请求如下所示


主界面中主要包括四个常用的块

  • Fiddler的菜单栏,上图绿色部分。包括捕获http请求,停止捕获请求,保存http请求,载入本地session、设置捕获规则等功能。
  • Fiddler的工具栏,上图红色部分。包括Fiddler针对当前view的操作(暂停,清除session,decode模式、清除缓存等)。
  • web Session面板,上图黄色区域,主要是Fiddler抓取到的每条http请求(每一条称为一个session),主要包含了请求的url,协议,状态码,body等信息,详细的字段含义如下图所示

二、HTTP请求图标说明


三、Statistic

关于HTTP请求的性能和其他数据分析

我们可以从中看出一些基本性能数据:如DNS解析的时间消耗是8ms,建立TCP/IP连接的时间消耗是8ms等等信息

四、Inspectors

分为上下两个部分,上半部分是请求头部分,下半部分是响应头部分。对于每一部分,提供了多种不同格式查看每个请求和响应的内容。

  • JPG 格式使用 ImageView 就可以看到图片
  • HTML/JS/CSS 使用 TextView可以看到响应的内容。
  • Raw标签可以查看原始的符合HTTP标准的请求和响应头。
  • Auth则可以查看授权Proxy-Authorization 和 Authorization的相关信息。
  • Cookies标签可以看到请求的cookie和响应的set-cookie头信息

五、Composer

老版本的fiddler中叫request-builder.顾名思义,可以构建相应的请求,有两种常用的方式构建请求

  • Parsed 输入请求的url之后executed即可,也可以修改相应的头信息(如添加常用的accept,host,referrer,cookiecache-control等头部)后execute`.
  • Raw。使用HTTP头部信息构建http请求。与上类似

六、fiddler过滤会话

问题:每次使用Fiddler,
打开一个网站,都能在Fiddler中看到几十个会话,看得眼花缭乱。

  • 期望:只想抓取自己想要的请求

七、Response乱码时的处理方法

问题:有时候我们看到Response中的HTML是乱码的, 这是因为HTML被压缩了, 我们可以通过两种方法去解压缩

  • 方法二:选中工具栏中的”Decode”。 这样会自动解压缩

八、反向代理-AutoResponder

原理:利用fiddler作為反向代理。意思就是将外界的request请求端口修改掉! 改写返回数据,最实用的功能

  • 用浏览器随意输入一个网址,如http://www.baidu.com/
  • 选中序号16记录,右击-勾选“Unlock fo Editing”,选择Fiddler右侧reponse块下的TextView,这里修改title,如图:

  • 选择Fiddler右侧reponse块下的TextView,这里修改title,如图:

  • 去掉“Unlock for Editing”,再选择右侧上方的AutoResponder,勾选下方的checkbox选框,并将序号16托到下方,同时,里面会多条记录,如下图:

  • 回到浏览器,刷新页面,如图,标题变为上面改的内容

九、fiddler提供了一个功能,让我们模拟低速网路环境

启用方法如:Rules → Performances → Simulate Modem Speeds

十、直接在fiddler上配置host

点击tools>>hosts,在里面填写自己想要设置的host即可

十一、Fiddler显示请求服务器的ip及系统环境的配置方法

  • 打开Rules——>Customize Rules
  • 找到如下这段代码
static function Main()
{
var today: Date = new Date();
FiddlerObject.StatusText = " CustomRules.js was loaded at: " + today;
// Uncomment to add a "Server" column containing the response "Server" header, if present

在这一行后面添加如下代码:

// 显示服务器web环境
FiddlerObject.UI.lvSessions.AddBoundColumn("Server", 50, "@response.server");
// 显示服务器IP地址
FiddlerObject.UI.lvSessions.AddBoundColumn("HostIP", 50, "x-hostIP");
}
  • 设置后重启fiddler,效果如下


十二、fiddler断点调试

第一种方法:菜单栏 Rules –》 Automatic Breakpoints –》 Before Requests(请求被发送到服务器端之前);或者 After Responses(响应返回客户端之前),这种设置对客户机发出的所有请求都进行拦截


十三、配合SwitchySharp插件使用

fiddler创建一个规则,代理到本地的8888端口(fiddler所用的端口)
google设置代理的方法:下载SwitchySharp插件,设置如下:

  • 接着点击保存即可~ 这样在需要的时候可以切换到Fiddler

支持一下
扫一扫,支持poetries
  • 微信扫一扫
  • 支付宝扫一扫