网站服务部小组文档

Fildder使用教程

Fiddler是目前windows平台强力的web调试工具,前端必备

安装

  • 访问小组的共享盘:\\192.168.22.10\Share\前端工具
  • 按顺序安装:fiddler2setup.exefiddler2_chajian.zip

抓Http包

Fiddler强大功能之一:捕获所有Http请求,包括客户端的

Alt text

从上面的截图看出一个http的请求以及返回,对于前端开发来说,能够清楚的知道一个HTTP是否有问题

单文件替换

Fiddler最强大功能:文件替换执行,意思是捕获线上文件(例如img,js,css,html等),然后用本地的对应文件替换执行或者显示,达到调试线上功能的功能

  1. 开启Fiddler后,刷新需要捕获请求的页面
  2. 如图所示:

Alt text

Alt text

Alt text

项目替换

整个项目替换,需要用到Fiddler的插件:Willow实现文件夹替换

最常见的需求:替换整个项目到本地执行,例如 http://zgmh.163.com/(即使此域名不存在也可以)

  • 开启Fiddler,右侧Tab切换到Willow

  • 如图所示:

Alt text

  • 右键,新建项目(Add Project),输入项目名字
  • 在项目名字上,右键,新建规则(Add Rule),如图:

Alt text

  • 最后刷新页面,请求变成深紫色表示成功

映射说明:

Match:表示映射的URL前缀,最后必须需要/结束

Action:表示本地的文件夹路径,最后必须要\结束