1. Fiddler 是什么？

Fiddler是用C#编写的一个免费的HTTP/HTTPS网络调试器。英语中Fiddler是小提琴的意思，Fiddler Web Debugger就像小提琴一样，可以让前端开发变得更加优雅。

Fiddler是以代理服务器的方式，监听系统的网络数据流动。运行Fiddler后，就会在本地打开8888端口，网络数据流通过Fiddler进行中转时，我们可以监视HTTP/HTTPS数据流的记录，并加以分析，甚至还可以修改发送和接收的数据。Fiddler还提供了清除IE缓存、请求构造器、文本转换工具等等一系列工具，对前端开发工作很有价值。

2. 下载和安装Fiddler

  1. 安装.net framework 2.0以上版本
  2. 从官方网站免费下载Fiddler。

Firefox中用Fiddler，可以下载一个插件：Fiddler开关

3. Fiddler的界面和功能

列表

左侧是数据列表，以不同的图标区分数据类型和状态，以下是图标对应的含义：
正在将请求数据发往服务器
正在从服务器下载返回数据
请求过程中暂停
返回过程中暂停
请求中使用了HTTP HEAD方法; 返回中应该没有body内容
请求中使用了HTTP CONNECT方法，建立HTTPS连接通道
返回的内容类型是HTML
返回的内容类型是图片
返回的内容类型是Javascript
返回的内容类型是CSS
返回的内容类型是XML
普通的成功的返回
返回内容为 HTTP/300,301,302,303 or 307 跳转
返回内容为HTTP/304: 使用本地缓存
返回内容为一个证书请求
返回内容是服务器错误
请求被客户端、Fiddler或服务器中断

查看器

利用查看器提供的很多形式，我们可以查看数据流的内容。

请求构建器（Request Builder）

可以创建任意数据的请求

过滤器

过滤器可以对左侧的数据流列表进行过滤，我们可以标记、修改或隐藏某些特征的数据流。

AutoResponse功能

这个功能可以算的上是Fiddler最实用的功能，可以让我们修改服务器端返回的数据，例如让返回都是HTTP404或者读取本地文件作为返回内容。我们将在实例中介绍利用AutoResponse功能。

文本编码和解码

提供了常用的一些文本编解码的转换。

此外，还可以对两个数据流进行比较

Fiddler可以保存和打开“SAZ”格式的文件，这样就可以将监听到的数据流保存下来，下次再重新打开分析。可以利用FiddlerCap——一个专门用来录制保存SAZ的小工具——保存SAZ文件。SAZ文件可以设置密码保护，比较贴心。

使用Fiddler提高前端工作效率 (介绍篇)的更多相关文章

  1. 使用Fiddler提高前端工作效率 (实例篇)

    上篇中,我们对Fiddler Web Debugger有了简单的接触,也许你已经开始在用Fiddler进行HTTP相关的调试,在这一篇,我们将通过一个实例了解Fiddler的神奇魔法. 在我们前端开发 ...

  2. html样式表极大地提高了工作效率

    样式表极大地提高了工作效率 样式表定义如何显示 HTML 元素,就像 HTML 3.2 的字体标签和颜色属性所起的作用那样.样式通常保存在外部的 .css 文件中.通过仅仅编辑一个简单的 CSS 文档 ...

  3. Android 上能提高学习工作效率的应用

    在知乎上有朋友问 Android 上能提高学习.工作效率的应用有哪些?我给他们的推荐获得了最多赞同.以后会不断完善更新此贴. Any.do :规划日程,各平台都有. Evernote:记笔记,各平台都 ...

  4. 程序员如何巧用Excel提高工作效率 第二篇

    之前写了一篇博客程序员如何巧用Excel提高工作效率,讲解了程序员在日常工作中如何利用Excel来提高工作效率,没想到收到很好的反馈,点赞量,评论量以及阅读量一度飙升为我的博客中Top 1,看来大家平 ...

  5. 利用 Ant 和 Eclipse 有效地提高部署工作效率

    读者定位为具有 Java 和 Ant 使用经验的开发人员. 读者可以学习到如何使用 Ant 解决一些多用户开发环境中,根据不同的目标环境编译成不同部署包的问题. 工作场景 现在有一个 web 项目,是 ...

  6. 【Java】能提高日常工作效率的一些Java函数

    自编工具总是临时抱佛脚来得顺溜,宜常备手边以提高工作效率: package com.hy; import java.io.File; /** * 日常工作常用的一些工具方法 * @author 逆火 ...

  7. Snipaste - 可以提高你工作效率的截图软件

    使用Snipaste提高您的工作效率 Snipaste是一个简单但功能强大的剪切工具,还允许您将屏幕截图固定在屏幕上.下载并启动应用程序,按F1开始剪切,然后按F3将其粘贴为浮动窗口.而已! 您还可以 ...

  8. 提高前端开发效率的N种方法

    一.使用固定的html模板和css公共样式 事先把模板建好,每次需要用的时候直接拿来就行,不再需要为浏览器兼容问题考虑太多时间 这里我整理了一套,希望对大家有帮助:http://www.cnblogs ...

  9. gulp + browserSync 一起提高前端开发效率吧！

    前端开发的时候,每次修改代码后,要移动鼠标到浏览器选中再刷新查看效果,不知觉间我们的加班的时间又增加了0.5s, 真是罪孽!所以在使用gulp之后,就一直对能自动监听文件刷新页面的browserSyn ...

随机推荐

  1. C++/C#/java开发支持求解

    本人大一学C语言,大二学VB,大三学VC,毕业后工作前两年用C++,接着两年用C#,最近几个月Android开发用Java. 以下本人总结以下,有些疑惑希望大师帮忙解答. 1. C语言,精简,灵活,适 ...

  2. Asp.net Mvc 自定义Session (二)

    在 Asp.net Mvc 自定义Session (一)中我们把数据缓存工具类写好了,今天在我们在这篇把 剩下的自定义Session写完 首先还请大家跟着我的思路一步步的来实现,既然我们要自定义Ses ...

  3. cocos2d-x载入texture

    转自:http://blog.csdn.net/aa4790139/article/details/8107325 SpriteTestLayer.cpp(就只改了这个这个文件) #include & ...

  4. Ubuntu 12.04 安装搜狗输入法

    安装指南 Ubuntu / Ubuntu Kylin 14.04 LTS 版本 只需双击下载的 deb 软件包,即可直接安装搜狗输入法. Ubuntu 12.04 LTS 版本 由于 Ubuntu 1 ...

  5. php中error_report函数的含义及各参数含义

    个错误级别,如下: 1        E_ERROR          致命的运行时错误.错误无法恢复过来.脚本的执行被暂停2        E_WARNING        非致命的运行时错误.脚本 ...

  6. cocos2d-x 2.1.4学习笔记01：windows平台搭建cocos2d-x开发环境

    cocos2d-x的大致开发流程是,首先使用win32版进行代码编写并完成游戏,然后将代码迁移到对应的开发环境上进行交叉编译完成游戏打包,如iphone上是mac+xcode,android是ecli ...

  7. 写个 Hello World 而已，要不要这么震撼？！

    Atom 编辑器的一个插件,可以让你写代码的时候体验狂拽酷炫的效果! 如果来点音乐.再配上机械键盘的话,写代码是不是爽到爆呢? 这货全名叫: activate-power-mode atom pack ...

  8. 解锁Dagger2使用姿势（二） 之带你理解@Scope

    关于Dagger2使用的基础如果你还不了解,可以参考我的上一篇文章解锁Dagger2使用姿势(一),这有助于你理解本篇文章. OK,我们在上篇文章介绍另外Dagger2使用过程中四个基本的注解,分别是 ...

  9. 【转】企业级Java应用最重要的4个性能指标

    应用性能管理(APM)是一种即时监控以实现对应用程序性能管理和故障管理的系统化解决方案.目前主要指对企业的关键业务应用进行监测.优化,最终达到提高企业应用的可靠性和质量,保证用户得到良好的服务,降低I ...

  10. Ajax实现页面后台button click事件无刷新弹窗

    很多人在做链接弹出新窗口的时候,都习惯用Response.Wrtite("<script>window.open('a.aspx')</script>") ...