Fiddler_官方网站
Fiddler_官方文档
Fiddler_官方视频
Fiddler_官方插件
1、Filddler简介
Fiddler是最强大最好用的Web调试工具之一,它能记录所有客户端和服务器的http和https请求,允许你监视,设置断点,甚至修改输入输出数据,Fiddler包含了一个强大的基于事件脚本的子系统,并且能使用.net语言进行扩展。
2、Filddler工作原理
Fiddler是以代理WEB服务器的形式工作的,浏览器与服务器之间通过建立TCP连接以HTTP协议进行通信,浏览器默认通过自己发送HTTP请求到服务器,它使用代理地址:127.0.0.1, 端口:8888. 当Fiddler开启会自动设置代理, 退出的时候它会自动注销代理,这样就不会影响别的程序。不过如果Fiddler非正常退出,这时候因为Fiddler没有自动注销,会造成网页无法访问。解决的办法是重新启动下Fiddler.
3、移动端抓包配置
前提条件是:安装Fiddler的机器,跟移动设备在同一个网络里, 否则移动设备不能把HTTP发送到Fiddler的机器上来。
具体操作步骤如下:
Fiddler设置打开Fiddler, Tools-> Fiddler Options。(配置完后记得要重启Fiddler).
选中"Allow remote computers to connect". 是允许别的机器把HTTP/HTTPS请求发送到Fiddler上来
配置fiddler.png
移动设备Fiddler配置
Android手机为例:
获取当前电脑IP:window+R——cmd——ipconfig
获取电脑IP.png
移动端配置1.png
移动端配置2.png
4、界面介绍
4.1 Fiddler主界面
4.2 工具面板
工具栏说明:说明注释、重新请求、删除会话、继续执行、流模式/缓冲模式、解码、保留会话、监控指定进程、寻找、保存会话、切图、计时、打开浏览器、清除IE缓存、编码/解码工具、弹出控制监控面板、MSDN、帮助。
两种模式:
1、 缓冲模式(Buffering Mode): Fiddler直到HTTP响应完成时才将数据返回给应用程序。可以控制响应,修改响应数据。但是时序图有时候会出现异常
2、流模式(Streaming Mode): Fiddler会即时将HTTP响应的数据返回给应用程序。更接近真实浏览器的性能。时序图更准确。但是不能控制响应。
4.3会话面板
4.4 监控面板
统计报表
(1) 请求总数、请求包大小、响应包大小;
(2) 请求起始时间、响应结束时间、握手时间、等待时间、路由时间、TCP/IP传输时间;
(3) HTTP状态码统计;
(4) 返回的各种类型数据的大小统计以及饼图展现。
时间轴
每个网络请求都会经历域名解析、建立连接、发送请求、接受数据等阶段。把多个请求以时间作为 X 轴,用图表的形式展现出来,就形成了瀑布图。在Fiddler 中,只要在左侧选中一些请求,右侧选择Timeline标签,就可以看到这些请求的瀑布图
1)绿色的请求表示这是一个“有条件的请求”。HTTP 协议定义了 5 个条件请求头部,最常见的两个是“If-Modified-Since”和“If-None-Match”。服务器根据这两个头部来验证本地缓存是否过期,如果过期则正常返回资源的最新版本;否则仅返回 304 Not Modified,浏览器继续使用本地缓存。包含条件请求头部的请求用绿色显示,否则用黑色。
2)有阴影线的请求是缓冲模式下的请求,实心的是流模式下的请求。Fiddler 提供了缓冲(Buffering)和流(Streaming)两种抓包模式:缓冲模式下,Fiddler 会在响应完成时才将数据返回给应用程序(通常是浏览器),这种模式下可以控制响应,方便地修改响应内容;流模式下,Fiddler 会实时返回响应数据给浏览器,但没办法控制响应。一般使用流模式,瀑布图会更真实一些。这两种模式可以通过 Fiddler 的工具栏选择。特别的,通过 Fiddler 的“AutoResponder”功能返回的响应,只能是缓冲模式。
3)请求条的不同颜色对应着不同类型的响应,根据响应头的 MIME Type 来归类。如浅绿色表示图片类型的响应;深绿色是 JavaScript;紫色是 CSS;其它都是蓝色。
4)请求中的黑色竖线,表示的是浏览器收到服务端响应的第一个字节这一时刻。这个时间受 DNS 解析、建立连接、发送请求、等待服务端响应等步骤的影响。
5)请求条后面的图标表示响应的某些特征。如软盘图标表示这个响应正文从本地获得,也就是说服务端返回了 304;闪电表示这是 Fiddler 的“AutoResponder”的响应;向下的箭头表示响应是 302,需要重定向;红色感叹号说明这个请求有错误发生(状态码是 4XX 或 5XX)。特别的,如果请求条后面有一个红色的X,说明服务端响应完这个请求之后,断开了连接。出现这种情况一般有两种可能:HTTP/1.0 的响应中没有 Connection: Keep-Alive;或者是 HTTP/1.1 的响应中包含了 Connection: close。使用持久连接可以省去建立连接的开销,也可以减小 TCP 慢启动和其它拥塞控制机制带来的影响,总之是好处多多。
6)请求前面的红色圆圈表示这个连接是新建的,绿色表示是复用的。上面的圆圈表示的是浏览器到 Fiddler 的连接,下面的圆圈是 Fiddler 到服务端的连接。
4.5 状态面板
控制台
Fiddler的左下角有一个命令行工具叫做QuickExec,允许你直接输入命令。
help 打开官方的使用页面介绍,所有的命令都会列出来
cls 清屏 (Ctrl+x 也可以清屏)
select 选择会话的命令
?.png 用来选择png后缀的图片
bpu 截获request
bpafter 截获response
5、HTTP协议简介
5.1、HTTP消息的结构
5.1.1、Request
先看Request 消息的结构, Request 消息分为3部分,第一部分叫Request line, 第二部分叫Request header, 第三部分是body. header和body之间有个空行。第一行中的Method表示请求方法,比如"POST","GET", Path-to-resoure表示请求的资源, Http/version-number 表示HTTP协议的版本号,当使用的是"GET" 方法的时候, body是为空的。
5.1.2、Response
5.2 状态码
Response 消息中的第一行叫做状态行,由HTTP协议版本号, 状态码, 状态消息 三部分组成。
状态码用来告诉HTTP客户端,HTTP服务器是否产生了预期的Response.
HTTP/1.1中定义了5类状态码, 状态码由三位数字组成,第一个数字定义了响应的类别
1XX —— 提示信息,表示请求已被成功接收,继续处理
2XX —— 成功,表示请求已被成功接收,理解,接受
3XX —— 重定向,要完成请求必须进行更进一步的处理
4XX —— 客户端错误,请求有语法错误或请求无法实现
5XX —— 服务器端错误,服务器未能实现合法的请求
常见响应码说明:
200:响应成功,这表明该请求被成功地完成,所请求的资源发送回客户端
302:重定向,新的URL会在response 中的Location中返回,浏览器将会自动使用新的URL发出新的Request
304:代表上次的文档已经被缓存了, 还可以继续使用,例如打开博客园首页, 发现很多Response 的status code 都是304
[提示: 如果你不想使用本地缓存可以用Ctrl+F5 强制刷新页面]
400 : 客户端请求与语法错误,不能被服务器所理解
403:服务器收到请求,但是拒绝提供服务
404 :找不到网页,请求的资源不存在
500 : 服务器发生了不可预期的错误
503 :服务器当前不能处理客户端的请求,一段时间后可能恢复正常
6、 常用功能
6.1 监听HTTPS
6.2 HOST切换
6.3 模拟各类场景
通过GZIP压缩,测试性能
模拟Agent测试,查看服务端是否对不同客户端定制响应
模拟慢速网络,测试页面的容错性
禁用缓存,方便调试一些静态文件或测试服务端响应情况
低网速模拟有时出于兼容性考虑或者对某处进行性能优化,在低网速下往往能较快发现问题所在也容易发现性能瓶颈,可惜其他调试工具没能提供低网速环境,而强大的Fiddler考虑到了这一点,能够进行低网速模拟设置Rules > Performance > Stimulate Modem Speeds。
6.4 Compare(对比文本)
6.5 Composer(构造器)
请求构造顾名思义就是我们可以模拟请求,也就是说我们可以借助Fiddler的Composer 在不改动开发环境实际代码的情况下修改请求中的参数值并且方便的重新调用一次该请求,然后相比较2次请求响应有何具体不同。任何一个请求参数只要是合法的取值再次调用后都会有相应的响应,那么你想要的任意一个合法请求组合自然也能够按照你的意愿构造出来,然后再次调用以及查看返回数据。
6.6 Filters(过滤监控)
对一个重新载入的页面进行抓包,如果包的条目过多而你需要关注的就那么几项的话,可以使用Fiddler的过滤器Filters进行抓包,那么抓包时只会抓取你希望抓到的那些包。切换到Filters标签勾选Use filter,以便激活过滤器,这样下面的各种过滤方式就可以进行选择了。
6.7 AutoResponder(请求重定向)
所谓请求无非就是需要调用到的一些资源(包括JS、CSS和图片等),所谓重定向就是将页面原本需要调用的资源指向其他资源(你能够控制的资源或者可以引用到的资源)。
你可以将前台服务器的诸多或者某个资源在本地做个副本,如果正常网络访问环境下该资源出现了BUG而导致开发环境崩溃时,可以先将这个资源的请求重定向到本地副本,这样就可以继续进行开发调试你的页面,从而大量节省资源维护的等待时间。
你也可以将多人同时维护的某个JS文件复制一份出来在本地,当你的开发调试收到他人调试代码干扰时,可以将这个JS的调用重定向到本地无干扰的JS文件,进行无干扰开发,功能开发完成并调试OK之后再将你的代码小心合入到开发环境中,这样就可以避免受到他人干扰专心搞你的模块开发,也就是说能够将JS文件脱离开发环境却不影响线上调试。
你还可以将样式文件或者图片指向本地。
6.8 Fiddler中设置断点修改Request和Response
Fiddler最强大的功能莫过于设置断点了,设置好断点后,你可以修改httpRequest的任何信息包括host, cookie或者表单中的数据。设置断点有两种方法:
第一种:打开Fiddler 点击Rules-> Automatic Breakpoint ->Before Requests(这种方法会中断所有的会话)
如何消除命令呢? 点击Rules-> Automatic Breakpoint ->Disabled
第二种: 在命令行中输入命令: bpu www.baidu.com (这种方法只会中断www.baidu.com)
如何消除命令呢? 在命令行中输入命令 bpu
Fiddler中设置断点修改Response跟断点修改Request用法差不多。
参考文档:http://www.cnblogs.com/FounderBox/p/4653588.html?utm_source=tuicool&utm_medium=referral
http://kb.cnblogs.com/page/130367/