⭐️ 本文首发自 前端修罗场(点击即可加入),一个专注 Web 技术、答疑解惑、面试辅导、职业发展的社区。现在加入,即可参与打卡挑战,和一群人一起努力。挑战成功即可获取一次免费的模拟面试机会,进而评估知识点的掌握程度,获得更全面的学习指导意见,不走弯路,不吃亏!

目录

  • 概述 2
  • Fiddler是做什么的,能帮助我们做什么? 2
  • 工作原理 2
  • 代理模式 3
  • 使用场景——提供的功能 3
  • 界面及使用介绍 3
  • 常用功能 10
  • HOST配置 10
  • 前后端接口连调——Composer 11
  • 网络限速FiddlerScript——测试在不同网络下的请求运行状况 13
  • 捕获IOS/Android移动设备上的请求 14
  • 插件介绍 15
  • 附录一 16
  • 图标解释: 16
  • web session的常用的快捷键 16
  • 参考: 17


Fiddler:译名—小提琴手,有Eric开发,曾就职微软。
Fiddle支持多个平台的版本:
Windows: https://www.telerik.com/download/fiddler
Mac/Linux: http://fiddler.wikidot.com/mono

但是,由于早期fiddler是基于.net开发的,所以在windows平台下支持的功能更多,
在IOS\Linux的支持会相对少。

类似工具:Charles http://www.charlesproxy.com/

概述

Fiddler是做什么的,能帮助我们做什么?

1、能够监听http/httpS的流量,可以截获从浏览器或者客户端软件向服务器发送的http/https请求;
2、对截获之后的请求,我们还能够查看请求中的内容;
3、伪造请求。不仅可以伪造客户端的请求,还能够伪造服务器的响应。——该功能能够方便我们进行前后端的调式。
4、测试网站的性能;
5、解密https的外部会话。因为https本身是一种加密的协议,通过fiddle我们可以进行解密操作;
6、提供第三方扩展插件,满足更多需求。

工作原理

需要经过fiddler的代理服务器代为转发请求与响应。
如何实现?
首先启动fiddler,然后在浏览器中查看局域网代理服务器。图示:

可以看到代理服务器的地址变成了127.0.0.1 ,这就是fiddler监听的地址。

代理模式

流模式与缓冲模式。

流模式:fiddler会实时把服务器返回给客户端的数据进行返回。 缓冲模式:fiddler会等待所有的请求都准备好之后才返回给客户端。

区别:缓冲模式下可以控制最后的服务器响应;而流模式下不能控制,是什么就是什么,更接近浏览器本身的真实行为。

选择:具体情况具体选择。

使用场景——提供的功能

1、开发环境的host配置;
2、前后端接口连调——Composer
3、定位线上bug——将发布文件代理到本地,快速定位线上bug;
4、性能分析和优化——Inspectors 、Timeline

界面及使用介绍

[外链图片转存失败(img-GWk0X8A1-1568635818027)(https://img-blog.csdn.net/20171018112015233?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvSW1hZ2luZUNvZGU=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast)]

1、菜单栏
2、工具栏

(1)气泡:备注。添加之后在会话栏的Comment列中显示备注内容。

(2)Replay:回放【常用】。重播一个会话。快捷键:”选中会话+R”

(3)清除会话面板:过滤请求、清除请求。

(4)Go:断点调式。配合状态栏上的断点工具。功能类似Debug。

(5)Stream:代理模式。默认:缓冲模式。点击进行切换。

(6)Decode:解压请求。解压http请求里面的东西,帮助查看。

(7)Keep:指示fiddler的保持会话数目。

(8)Any Process:捕获请求,只看需要的请求。将“靶心”投向需要的请求。

(9)Find:查找请求。用颜色标注查找的请求。

(10)Save:保存会话。

(11)截图:默认5秒后截图。

(12)计时器:第一次点击-开始计时;第二次点击–返回计时结果;第三次点击-清零,重新计时。右键点击—不计时。

(13)Browse:启动浏览器;

(14)Clear Cache:清空缓存;

(15)TextWizard:【常用】编码、解码文本内容;

(16)Tearoff:浮窗。

3、会话面板【fiddler核心功能之一】

Server IP:需要配置。

Ctrl+F :搜索”static function Main()”,添加代码:

FiddlerObject.UI.lvSessions.AddBoundColumn(“Server IP”,120,”X-HostIP”);
然后重启Fiddler。

4、详情和数据统计面板

(1)Statistics:数据统计面板。性能分析。

RTT:【主要关注】体现一个请求从发送到返回响应的时间。
通过选择多个会话来得来这几个会话的总的信息统计,比如多个请求和传输的字节数。选择第一个请求和最后一个请求,可获得整个页面加载所消耗的总体时间。从条形图表中还可以分别出哪些请求耗时最多,从而对页面的访问进行访问速度优化。

(2)Inspectors :对抓到的请求进行解包,查看具体内容。

(3)AutoResponder:文件代理【常用】。例如,将一个需要服务端返回的文件,使用本地文件做代理。

(4)Composer:前后端接口连调,伪造请求【常用】。实现不写任何js代码的情况下实现与服务端的接口调式。

(5)Timeline: 性能分析。对选择多个请求有意义。作用类似HttpWatch.

5、控制面板:

(1)命令行工具:执行一些快捷操作。

常见的命令有:

  • help 打开官方的使用页面介绍,所有的命令都会列出来
  • cls 清屏 (Ctrl+x 也可以清屏)
  • select 选择会话的命令
  • ?.png 用来选择png后缀的图片
  • bpu 截获request

(2)状态栏:

Capturing:开启/关闭 fiddler的监听;

Web Browsers:过滤会话选择;

常用功能

HOST配置
将线上的服务器IP配置为指向本地服务器IP。将线上所有的文件的地址都映射到本地。

1、文件替换\线上bug调式——AutoResponder

(1)、可用于拦截某一请求,并重定向到本地的资源,或者使用Fiddler的内置响应。可用于调试服务器端代码而无需修改服务器端的代码和配置,因为拦截和重定向后,实际上访问的是本地的文件或者得到的是Fiddler的内置响应。
因此,如果要调试服务器的某个脚本文件,可以将该脚本拦截到本地,在本地修改完脚本之后,再修改服务器端的内容,这可以保证,尽量在真实的环境下去调试,从而最大限度的减少bug发生的可能性。

(2)、不仅是单个url,Fiddler支持多种url匹配的方式:

I. 字符匹配 如 example可以匹配 http://www.example.com和http://example.com.cn
II.完全匹配 以EXACT开头表示完全匹配,如上边的例子 EXACT:http://blog.csdn.net/ohmygirl
III. 正则表达式匹配
以regex: 开头,使用正则表达式来匹配URL
如:regex:(?insx).*.(css|js|php)$
表示匹配所有以css,js,php结尾的请求url

(3)、操作——模拟
http://cn.babybus.com/join/index_campus.shtml下的function_campus.js文件

[外链图片转存失败(img-gxbWFwAM-1568635818076)(https://img-blog.csdn.net/20171018113258340?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvSW1hZ2luZUNvZGU=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast)]

前后端接口连调——Composer

选中一个接口——>拖拽到Composer面板;
准备工作:
接口请求方式、请求参数;
Get请求:参数直接写在接口里面

Post请求:参数写在Request Body里面。

同时,我们还能够伪造Request Header中的Cookie。

网络限速FiddlerScript——测试在不同网络下的请求运行状况

原理:将请求代码化。
OnBeforeRequest()表示在发送一个请求时需要做什么。

例如:

添加代码:
oSession[“resquest-trickle-delay”]=”3000”;//表示延时3秒请求;
oSession[“response-trickle-delay”]=”3000”;//表示延时3秒响应;

缺点:需要编写C#代码。
解决方案:使用图形化插件;

捕获IOS/Android移动设备上的请求

1)首先设置fiddler。菜单栏Tools—》Fiddler Options。


2)让你的电脑与移动设备处于同一个WiFi连接状态(不要使用VPN),然后命令行ipconfig查看本机IP。

3)使用你的移动设备在浏览器上访问本机IP加“端口号”。例如:192.168.1.28:8888,然后会出现一个Fiddler的证书,安装该证书。


4)设置你的移动设备。让设备处在WiFi连接,设置代理为手动。然后填写代理IP为你的电脑的IP,端口号为8888。

5)现在你就可以在手机上操作,例如访问浏览器,此时在fiddler就能监听到了。

插件介绍

插件下载地址:
http://www.telerik.com/fiddler/add-ons
例如:

  • Javascript Formatter——Javascript格式化插件
  • Traffic Differ——文件比较插件
  • 第三方插件 Willow ——http代理插件

附录一

图标解释:

web session的常用的快捷键

  • CTRL+A: 选中所有的session;
  • ESC: 取消选中所有的session;
  • CTRL+I 反向选中;如果session已选中,则取消,否则选中;
  • CTRL+X 删除所有的session;
  • Delete: 删除选中的session;
  • Shift+Delete 删除所有未选中的session;
  • R 重新执行当前请求;
  • SHIFT+R 多次重复执行当前请求
  • U: 无条件重新执行当前请求,发送不包含If-Modified-Since 和 If-None-- Match的请求头;
  • SHIFT+U 无条件地多次重复执行当前请求;
  • ALT+Enter 查看当前session的属性;
  • Insert:切换是否用红色粗体标记选中的session;
  • M 给选中的session添加描述;

参考:

http://blog.csdn.net/fyifei0558/article/details/30283937

http://www.tuicool.com/articles/YBbm6fr

http://my.oschina.net/leejun2005/blog/399108

http://blog.chinaunix.net/uid-27105712-id-3738821.html

http://www.cnblogs.com/yuzhongwusan/archive/2012/07/20/2601306.html

http://blog.csdn.net/ohmygirl/article/details/17855031

http://www.tuicool.com/articles/uM7RRjj

http://blog.csdn.net/ohmygirl/article/details/17849983

❤️ 现在关注【前端修罗场】,后台回复【666】,即可获取一份【免费的优质学习资料】,一起学习,一起进步,不走弯路,不吃亏~

【工具】抓包工具 Fiddler 使用教程相关推荐

  1. HTTP协议和抓包工具Fiddler

    HTTP,Fiddler 1.HTTP是什么 2.HTTP协议与客户端和服务器 3.HTTP协议的报文格式 1.抓包工具 2.HTTP报文格式 1.HTTP请求的报文格式 2.HTTP响应的报文格式 ...

  2. app抓包工具-fiddler的基本使用

    链接:https://pan.baidu.com/s/1gruMSVQ1qcx1WCmYINs2UA 提取码:yn0g 下载fiddler APP抓包原理:⒈客户端向服务器发起HTTPS请求⒉抓包工具 ...

  3. Mac和Linux平台抓包工具的配置和使用

    996技术站 - 活在未来 | KingSun966技术站,极客带你看世界!https://www.996station.com程序员开发指南Descriptionhttps://guide.996s ...

  4. 【软件测试】2021年软件测试领域常用工具总结(1)-抓包工具与单元测试工具篇

    前言 大家好,我是洋子,作为一名测试开发/软件测试工程师, 在进行软件测试的过程中,会用到测试工具去辅助测试,以提高测试工作的效率.今天就给大家介绍一下2021年软件测试领域当中的最流行,最实用的工具 ...

  5. 详解Android/IOS平台下抓包工具使用以及抓取API接口

    抓包工具 Charles 主机允许代理模式 客户端设置代理 截获数据包 HTTPS 模仿一个app UI 请求接口封装 加密请求 Headers 参考项目 抓包(Packet Capture),实际上 ...

  6. Fiddler抓包:详解Fiddler抓包工具软件使用教程

    为什么要先学fiddler?学习接口测试必学http协议,如果直接先讲协议,我估计小伙伴们更懵,为了更好的理解协议,先从抓包开始.结合抓包工具讲http协议更容易学一些. 抓firefox上https ...

  7. 『Python爬虫』抓包工具 Fiddler 入门教程

    如今Python爬虫越来越火,有想学好Python爬虫的小伙伴可以前往gzh[Python编程学习圈]领取系统的学习资料以及教程视频,还分享有大量的技术干货文章可以阅读学习,欢迎大家关注学习. 传统的 ...

  8. 【Fiddler Everywhere】2022最强抓包工具(安装 修改教程)

    人生苦短 我用python 今天来给大家整一个史上最强抓包工具(安装 修改教程)! 源码.资料电子书点击这里 一.Fiddler简介 Fiddler Everywhere 是啥? 从名称上来看, 就大 ...

  9. 抓包工具Fiddler的使用教程(十二)下:Fiddler抓取HTTPS

    在教程十二(上),我们也了解了HTTPS协议,该教程就和大家分享Fiddler如何抓取HTTPS 抓包工具Fiddler的使用教程(十二):[转载]HTTPS协议 再次回忆一下关键内容: iddler ...

  10. 抓包工具:Fiddler下载、安装、使用 教程

    文章目录 抓包工具:Fiddler下载.安装.使用 教程 一.Fiddler 下载 二.Fiddler 安装 三.Fiddler 使用 3.Statistics 请求的性能数据分析 4.Inspect ...

最新文章

  1. python 中 sorted() 和 list.sort() 的用法
  2. 【Python】青少年蓝桥杯_每日一题_9.11_买鸡
  3. UDP和TCP的优缺点
  4. 发布单机端DELPHI程序访问MySQL必备文件
  5. tensorrt基础知识+torch版lenet转c++ trt
  6. 降低成本是永恒的追求(xamarin)
  7. MOSS中代码运行的权限提升(半摘)
  8. AJAX技术文案沙雕,vue-router 中使用 keep-alive 控制 ajax 请求的缓存策略(二)
  9. 编译Android系统源码
  10. 计算机课英语怎么读音标,【英语课堂】48个国际音标表及发音详解图
  11. IntelliJ IDEA 2020 提示“Unmapped Spring configuration files found.Please configure Spring facet.”解决办法
  12. 分类与聚类的区别以及聚类的方法分类
  13. LTE上行物理层传输机制(1)-PUSCH上行跳频之Type1频率跳频
  14. LANDESK DM桌面管理之客户端配置及部署篇
  15. 广工学生“纯手工”打造赛车 将出征F1赛道
  16. 论文阅读:Meta-Learning in Neural Networks: A Survey
  17. 2021-07-13 ARM cortex三个版本A、R、M简单介绍
  18. 【VSPD虚拟串口】【Modbus Poll】【Modbus Slave】仿真工具的学习过程
  19. 如何用linux搭建简单的论坛
  20. vuex本地储存方案

热门文章

  1. Android模拟器运行慢
  2. 威联通QNAP-通过WinSCP访问安装路径并执行命令
  3. 49. HTTP 请求/应答
  4. AI换脸踩坑记录:Faceshifter
  5. python 接口(抽象) 多态,鸭子类型, 多继承原理(mro)
  6. word删除空行的方法(总结最好用的)
  7. 当n趋向于无限大时,n的0.1次方和logn谁大
  8. 如何制作 RedHat Linux6.7 系统 U盘安装盘
  9. ping服务器地址加时间显示,如何对IP地址进行Ping测试
  10. 设计师如何学习html_HTML5视频:设计师需要知道的10件事