Web开发又一利器之 Fiddler 使用教程

fmms 12年前

1.引言

在当前web开发工具满天飞的年代,很难想象当时在没有这些工具的年代,我们是怎么挺过来的。既然时代已经赋予我们如此之多的精良工具,那么就在工作之中尽情享用吧。

在需要截获客户端与服务器端之间的通讯数据时,我们会使用httpwatch或firebug。

在跟踪样式或调试js代码时,我们会在浏览器下按下F12,来启用开发者工具;会在js代码中加上debugger或借助开发者工具的断点(breakpoint)进行逐步调试。

以上工具或方法都能很好的解决我们面临的问题但如果服务器在远程而非本地,在我们不能登录到服务器的情况下,我们如何在代码中添加debugger,或者又如何修改一些代码尝试看看运行效果呢?此时我们必须借助另一利器:Fiddler。

ps: Fiddler项目主页及下载地址 www.fiddlertool.com  , 它是个免费软件。 同类的商业产品有HTTPWatch:http://www.httpwatch.com 。

2.Fiddler代理工作原理

Fiddler是微软开发的一个工具,可用来截获本机与服务器之前的所有http通信,在这个过程中充当一个代理的角色。

在我们启动Fiddler的时候,Fiddler便已经作为了一个代理服务器,如下图所示:

Web开发又一利器之 Fiddler 使用教程

作为系统代理,所有的来自互联网服务(WinInet)的http请求在到达目标Web服务器的之前都会经过Fiddler;同样的,所有的Http响应都会在返回客户端之前流经Fiddler。如下图所示:

Web开发又一利器之 Fiddler 使用教程

3.Fiddler界面描述

Web开发又一利器之 Fiddler 使用教程

4.Fiddler请求中断

可以进入菜单“Rules/Automatic Breakpoints”来设置对请求进行中断,设计的时机可以是Before Requests、After Response。这样我们就可以利用工具修改提交到服务器的数据信息(如:请求头或请求体等),也可以修改从服务器端返回的数据。

  • 以下为截获提交到百度的数据,我们可以对提交的信息进行修改。

Web开发又一利器之 Fiddler 使用教程

  • 以下为截获到百度返回的数据,我们可以对返回的信息进行修改。(注意:如果返回的数据进行了压缩,那么默认将为乱码,可以使用顶部菜单“Rules/Remove All Encodings”来解码。)

Web开发又一利器之 Fiddler 使用教程

5.Fiddler请求内容替换

Fiddler请求中断”章节,我们已经介绍了如何修改提交到服务器端的数据及修改服务器端返回的数据,但如果觉得这样仍不过瘾,我们也可以完全用本地文件来代替需要从服务器下载的文件,这在我们诊断跟踪一些js文件但却不能修改js文件时非常有用。

比如:在用浏览器测试P页面时,P页面引入了一个js资源文件R.js,由于R.js文件在服务器S上,而我此时又不能登录S服务器(没有S服务器的帐 号),此时我们就可以通过浏览器将R.js文件下载到本地,然后对本地的R.js文件进行调整,最后通过设置Fiddler,将R.js文件的请求使用本 地的R.js文件。截图如下:

其中

EXACT表示完整匹配URL时,才进行映射处理

regext:(?insx)表示可以使用正则来匹配哪些URL需要进行映射处理

其他一些参数不再一一说明。

Web开发又一利器之 Fiddler 使用教程
来自:http://blog.csdn.net/yhawaii/article/details/7245625