代码改变世界

使用Fiddler辅助观看InfoQ的视频

2009-12-29 12:04  Jeffrey Zhao  阅读(10249)  评论(26编辑  收藏  举报

InfoQ是一个好地方,而我认为其中最有价值的资源,便是其中的演讲视频。InfoQ在这方面有个特点:在演讲视频下方提供了清晰的幻灯片,而在播放的同时,还会根据进度进行切换。这观看体验自然比单纯的演讲录像要高出许多。可惜的是,时不时有朋友会向我反馈说,InfoQ实在是太慢,几乎无法流畅地观看视频。由于一时半会儿InfoQ也不会在中国放CDN,因此视频加载速度这问题……几乎无法解决。还好,如果我们退而求其次,至少可以使用Fiddler等工具来“缓解”这个问题。

Fiddler简介

Fiddler是Eric Lawrence完全使用.NET开发的一个免费HTTP调试工具,后来微软连人和工具一起收购之后,也把它在当作一个产品在做。Fiddler在工作时本身并不进行网络嗅探的工作,它只是充当一个“代理服务器”的功能,而任何软件只要使用这个代理,Fiddler便可以截获它发出的所有请求,进行跟踪,查看,甚至我们一会儿会看到的更多高级工作。关于Fiddler的更多信息,您可以关注PDC 09中Eric Lawrence做的演讲,内容还是挺充实的。

因为有了Fiddler,我几乎已经完全不用Firebug的Net功能了,因为它的功能有限,且只能基于Firefox运行。由于Fiddler的工作原理,它可以在任何一个使用代理服务器的工具中使用。当然,Fiddler的这个工作原理,也导致它无法获得某些信息。例如Firebug可以获得某个请求在浏览器中的等待时间,或是DNS的解析时间——而Fiddler只能跟踪请求发起后的情况。

Fiddler还支持扩展,编写Fiddler扩展很容易。Fiddler还提供了如FiddlerCore这样的核心类库,可以让我们的程序提供如Fiddler那样的嗅探功能。不过这些话题超出了这次的内容,我们这次只使用Fiddler自带的功能。

下载视频

那么,我们又该如何使用Fiddler来辅助观看InfoQ的视频呢?因为视频在线观看速度很慢,我们很自然想到,把它下载到本地再观看就没有这个问题了。一般此类在线视频都是请求一个flv文件,而这个文件的路径可以轻松地使用Fiddler获取到。

例如,您可以打开Fiddler,在浏览器中进行代理服务器设置(可能自动已经设好了),然后打开InfoQ中Statically Dynamic Typing这个视频,代页面加载完毕后点击视频的播放按钮。于是,Fiddler便可以截获如下请求:

请看上图中截获的最后那个请求,是一个flv文件。您可以对其点击鼠标右键,再选择Copy - Just Url,便可以复制这个文件的完整地址。然后,您便可以使用下载工具或任何方式把这个文件下载到本地,存放在硬盘上。至此第一步就完成了。

设置过滤条件

对于某些站点的视频播放来说,您已经可以直接查看下载后的文件了。不过对于InfoQ的视频来说,您如果直接在本地播放,便无法享受“幻灯片”的同步功能。很自然的,我们希望视频播放页面可以使用我们本地的文件。不过这是下一步要做的事情。而现在我们先来做另一件事情,那便是设置Fiddler的过滤条件。

由于Fiddler的原理是截获通过自身(即代理)的所有请求,因此有时候也会得到很多不必要的信息。例如,我们在Internet Options中设置了代理服务器后,所有IE或Chrome的页面,甚至MSN亦或是您自己写程序时使用WebClient或WebRequest发出的请求,都会通过这个代理。此时您会发现Fiddler中的请求密密麻麻,且会不断增长,非常影响调试工作。

此时,您可以设置一个过滤条件,告诉Fiddler,只有满足特定条件的请求才捕获进来。设置过滤条件并不难,Fiddler提供了一个Process Filter小图标(如上图),您可以把它拖拽至某个程序窗口上,这样只有那个进程发出的请求才会被捕获。不过这么做有时很不方便,因为如现在的浏览器,如IE 8或Chrome都是多Tab的,每个Tab都属于不同的进程,拖放时很可能会不知所云。因此,我们在这里手动设置过滤条件:

首先,还是上图的结果,不过我们把横向滚动条拖至右侧,可以发现在Process栏目中写着“chorme:6764”字样,这表示该进程的名称及pid。于是,我们可以在Fiddler的Filter栏目中把它设为唯一的过滤条件:

再试试,看看Fiddler是不是只截获那个Tab所发出的请求?

设置断点

万事俱备,只欠东风。我们要做的最后一步,便是让Fiddler把原本对远端flv文件的请求转为本地的请求。这便可以利用Fiddler的断点功能。

由于Fiddler会在所有捕获的请求上进行中断,因此我们必须减少捕获的请求。例如,把过滤条件设为视频播放页面便是一个不错的选择。假如您已经设好了过滤条件,那么可以打开播放页面(但不要进行播放),再清除Fiddler中已经捕获到的信息。然后,设置断点:

选择Before Requests,这样Fiddler会在得到请求信息之后暂停,等待我们后续处理(图片可点击放大):

然后,我们只要选择Choose Response - Find a file:

然后选择我们我们下载到本地的文件,在点滴“Run to Completion”就可以了。不过,开始播放之后记得禁用Fiddler的断点,否则页面在切换幻灯片的时候也会被Fiddler暂停——这就不太好了。

总结

看看,现在播放起来是不是很流畅?Fiddler其实还有许多有用的功能,几乎可以说是“Web相关”开发人员的必备工具了。Fiddler的发展也很迅猛,本身也有非常强大的可扩展性。如果您的项目需要有类似Fiddler的嗅探功能,不妨可以朝这方面进行一番探索。