Fiddler的功能

1. 监控HTTP流量
2. 查看截获的请求内容, 伪造请求
3. 测试网站性能(网站优化)
4. 解密HTTPS回话
5. 三方插件

Fiddler使用

1. 流模式 (实时返回数据) 更接近浏览器本身的行为
2. 缓冲模式 (所有数据全部获取之后才返回)

使用场景

1. 开发环境HOST配置
2. 前后端接口调试
3. 线上bugfix
4. 性能分析和优化
   • fiddler会提供请求的实际图, 清晰明了网站需要优化的部分

fiddler 工具栏

1. 备注 短信信息图标 对捕捉到的回话添加备注

2. replay 回放按钮 重新请求 R快捷键

3. X 清空监控面板(ctrl+x)

4. GO 请求的时候设置断点 让断点继续往下走

   • 结合状态栏
   • 设置断点: webbrowser 右边点击一下(红色) 箭头朝上表示发送的时候 朝下表示响应的时候
   • 点击GO, 继续往下执行

5. stream模式切换 (默认是缓冲模式)

   • 流模式和缓冲模式的切换

6. decode 解压请求 Keep:all sessions 保持回话

   • 保存越多占用内存越大

7. Any Process 过滤请求

   • 比如指向看到chrome的请求 点击 鼠标中心移动到chrome上捕获一下

8. find 查找 对需要查找的进行颜色高亮

9. save 对当前的回话进行保存

   • 鼠标拖动 选中一块区域
   • save 保存为sazz文件
   • file -> recent archives -> 选中文件加载进来

10. 截图 保存 5s之后进行截图

11. 计时器 点击一下计时 再点击一下显示时间 再点击清0

12. 快速打开浏览器

13. Clear Cache 清除IE浏览器的缓存

14. TextWizard 编码解码

    • base64
    • url-encode/decode
    • html-encode/decode

15. TearOff 分离面板 右侧面板分离

    
    
    fiddler工具栏.png

fiddler 状态栏

image.png

1. 褐色区域控制台 (输入各种命令)

   • 输入help 查看常用命令

2. cature 控制fiddler是否工作

   • 点击一下 fiddler就不工作了
   • 是否让fiddler工作

3. Web Browsers 过滤回话来源

   • WebBrowsers 只查看浏览器的请求
   • 或者查看来自于其他来源

4. 记录当前回话的数量和回话的地址

5. 选中某一会话后: 访问的url地址

fiddler 监控面板

1. statistics 数据统计

   • 请求性能上的指标(分析优化web性能)
   • 关注RTT数据: 往返时间 请求发送到响应结束

2. inspectors 对请求解包

   • 查看请求和响应的详细内容

     
     
     image.png

3. AutoResponder 文件代理

   • 截获文件
   • 将该请求文件拖到右侧面板中
   • 右侧底部 rule editor 第二栏控制请求响应状态码
   • 或者选择find a file 选择本地的一个文件
     
     AutoResponseder.png

4. composer 前后端的接口联调

   • 将请求拖入
   • 查看请求的参数

   • 修改请求参数进行请求调整 execute进行伪造请求执行

     
     
     前后端联调 请求伪造

5. log 日志面板

6. timeline

   • 相当于浏览器中的http watch
   • 选中一块区域的请求 查看timeline, 进行网站性能分析

   • 性能优化的关键点

     
     
     Timeline面板分析

Fiddler 文件 文件夹代理

1. HOST配置
   • 需求: 让远程文件指向本地
   • Tools->Hosts->enabled激活功能
   • 本地ip 域名地址 添加到文件中
     • 192.168.123.1 www.baidu.com 本地服务器 远程服务器 , 然后保存文件
     • 禁用host 1. enabled去掉 save 2.关闭Fiddler软件禁用

   • 上述: 将一个域名下的所有文件进行映射到一个IP地址下

     
     
     本地文件代理

2. 文件替换(只想映射一个文件)

   • HOST是所有文件都进行映射
   • autoResponder 场景 定义线上场景bug 进行文件替换
     • 线上某一个文件除了问题的时候
     • 将该文件映射到本地, 修改看是否有问题
   • 左侧选中文件拖到AutoResponder中 (步骤)
     • Exact 精准匹配 也支持正则表达式
     • find a file
     • 替换规则 然后保存save
     • 还可以替换成一些响应吗

3. Fiddler请求模拟, 前后端接口调试

   • Composer 面板中 GET请求:
     • 输入请求网址和请求参数
     • Execute
   • POST请求:
     • 请求参数放在RequestBody中
     • id=confidence&name=zhangsan&age=20
   • 配置ReuestHeader
     • 按照key:value的形式进行模拟伪造

4. Fiddler网路限速

   • 关注事件: onBeforeRequest

     //发送请求的时候限速3s
     oSession('request-trickle-delay') = "3000"
     
     // 响应延迟 模拟低速
     oSession('response-trickle-delay') = "3000"
     

限速追踪

Fiddler插件 插件官网

1. Fiddler 代码格式化插件 (JavaScript Formatter)

   • 鼠标右击左侧栏中的回话 -> Make Javascipt Pretty -> 右侧响应SystaxView

   • TrafficDiffer 对比两个不同的回话

     • differ 在右侧面板中
     • 往里面的两侧中各拖入一个请求回话
     • 进行对比分析 (对于优化, 对比两个序列)

2. Fiddler http代理插件

   • 第三方插件: Willow
     • 快速管理host文件
     • 进行可视化管理
     • 可视化限速