1.简介

按照从上往下,从左往右的计划,今天就轮到介绍和分享 Fiddler 的会话面板了。

2.会话列表 (Session list) 概览

Fiddler 抓取到的每条 http 请求(每一条称为一个 session),会话列表 主要是 Fiddler 所抓取到的每一条 http 请求都会显示到这里。主要包含了请求的 ID 编号、状态码、协议、主机名、URL、内容类型、body 大小、进程信息、自定义备注等信息,如下图所示:

3.会话列表各个列详解

3.1 每个字段的含义

会话列表中又包含了很多字段,而每一个字段都有其自己的含义,用来描述当前每一条会话的详细信息!

各个字段的含义描述如下表所示:

名称 描述
# 显示抓取的请求id顺序和类型图标,id 从 1 开始递增,HTTP Request 的顺序,从 1 开始,按照页面加载请求的顺序递增
Result HTTP 响应结果状态码
Protocol 当前请求会话所使用的协议,如HTTP/https://image.baidu.com/search/down?url=https/FTP等等
Host 请求地址的主机名或域名(也会是主机名和端口号)
URL 从服务器请求资源的文件路径,有的时候也包含GET请求的具体参数
Body 响应内容的大小, 单位为字节 也就是响应主体(Response Body)中的字节数
Caching 请求的缓存过期时间或缓存控制 header 等值,即响应头中 Expires 和 Cache-Control
Content-Type 响应内容的类型,以及编码类型
Process 发送此请求的程序与进程id:例如chrome:1604。发出此请求的 Windows 进程和进程 ID
Comments 允许用户给请求会话添加备注文本信息。用户通过脚本或者右键菜单给此 session 增加的备注
Custom 允许用户设置使用脚本设置自定义字段
........................................

3.2 记录不同颜色的含义

每个记录不同图标和不同颜色的含义如下:

1 红色:表示HTTP状态(错误)
2 黄色:表示HTTP状态(认证)
3 灰色:表示数据流类型 Connect 或表示响应类型为图像
4 紫色:表示响应类型为 CSS
5 蓝色:表示响应类型为 HTML
6 绿色:表示响应类型为 Script
7 在Fiddler Script session 的 ui-color 标志位中可以修改字体的颜色

3.3 图标含义

icon 含义
正在将请求发送到服务器
正在从服务器读取响应
请求在断点处暂停
响应在断点处暂停
请求使用 HTTP HEAD 方法;反应应该没有身体
请求使用的 HTTP POST 方法
请求使用 HTTP 连接方法;这将建立用于 https 流量的隧道
响应是 HTML
响应是图像
响应是一个 JS 脚本
响应是级联样式表
响应为 XML
响应为 JSON
响应是音频文件
响应是视频文件
响应是一个 Silverlight 小程序
响应是一个 Flash 小程序
响应是字体
通用成功响应
响应是 HTTP/300,301,302,303 或 307 重定向
响应为 HTTP/304:使用缓存版本
响应是对客户端凭据的请求
响应是服务器错误
会话被客户端、Fiddler 或服务器中止。
表示请求的格式为html格式

4.操作会话面板列

在每一个列上面当右键点击 session 框中的列时,可以发现有 5 个功能,如下图所示:

4.1Search this column (搜索此栏)

意思是它会根据每一个栏位的特性来进行条件搜索此栏位, 这样可以快速帮助用户精准找到想要的数据信息,如下图所示:

4.2Flag duplicates (重复会话标志)

标记列中的相同项并将相同项背景滤为绿色。这个功能可以给我们的会话打上标志背景, 并且这个背景颜色标记的是当前列中存在重复的数据

举个例子吧: 例如我们在 URL 这一栏上右键选择 Flag duplicates 那么就会在当前列中存在重复 URL 的数据上打上一个绿色💚的背景,如下图所示:

5.自定义列

在 Fiddler 的会话面板中不会展示请求方式,虽然请求头中有展示,但是每次看接口,都得一个一个点开查看,也很麻烦,因此宏哥就以此为例子,添加请求方式列在会话面板。如下图所示:

宏哥这里提供两种自定义列的方法,第一种方法:界面配置自定义列,第二种方法:通过脚本自定义列。具体步骤如下:

5.1 界面操作配置自定义列

1.在列名上,鼠标右键,即可弹出如下信息 ,,然后点击 Customize Columns,则弹出如下图所示的弹框。如下图所示:

2.Collection 选择 Miscellaneous,Field Name 选择 RequestMethod。如下图所示:

3.选择该字段后,你还可以定义列表的宽度以及列名。如下图所示:

4.点击 Add 后,你自定义添加的列则会展示在 Fiddler 会话面板中。如下图所示:

5.2 通过脚本自定义列

Fiddler 会话面板列有 Result、Protocol、Host、URL、Content-Type 等等,但有时候我们可能会遇到这样的场景:宏哥需要知道当前请求与应答服务器的 ip,那么,如果给 fiddler 添加一列 “ServerIP”,每一个 session 都会显示 ip,那自然是再好不过了。以此为例宏哥讲解和分享一下如何通过脚本添加此自定义列。其实主要就是操作这个文件 Fiddler2\Scripts\CustomRules.js。

1.在 Fiddler 点击 Rules,然后再点击 Customize Rules,打开添加脚本的文件,如下图所示:

2.Ctrl+F 查找字符串 static function Main(),如下图所示:

3.在其方法体的最后添加如下一行脚本代码,如下图所示:

FiddlerObject.UI.lvSessions.AddBoundColumn("栏位名称自定义", 120, "X-HostIP");

4.保存脚本后,你自定义添加的列则会展示在 Fiddler 会话面板中。如下图所示:

5.3 隐藏字段

刚才讲的是添加字段,那可能会有疑惑,我添加后,以后不想要这个字段展示,那该如何处理?

在自定义列时,有个隐藏属性。如果想不展示哪个列字段,在对应字段上右键,选择隐藏即可。选择 Hide this cloumn 即可,隐藏后,则不会展示了。操作如下图所示:

5.4 展示隐藏的字段

我们将字段隐藏后,还能支持再展示吗?答案是肯定的,操作同理,选择 Ensure all cloumns are visible 即可,隐藏的列就会展示出来了。操作如下图所示:

列的自定义,如上操作就可以轻松搞定了。我们在之前也看到,自定义时,可以定义很多字段的;也可以定义请求头、响应头;看各自需求,自定义即可。

5.5 请求会话的复制操作

Fiddler 中提供了很多对请求会话的复制操作,让你更好的去获取想要的数据。你可以在会话列表中选择你要操作的会话,然后右键选择 copy。如下图所示:

其中子菜单含义如下表,你根据需求进行选择就可以了。如下表所示:

菜单名称 描述
Just URL 复制请求的主机名+URL资源的路径
Terse Summary 复制请求的方法+URL+响应状态
this Column 复制当前请求中的本列信息
Headers Only 以格式化形式复制当前会话的请求报文和响应报文
Session 复制当前原始会话 跟Headers Only差不多
Response DataURL 以及base64编码的形式复制响应数据的URL
Full Summary 复制当前会话信息对应的列

5.6 请求会话的保存操作

Fiddler 对会话的存储也制定了一些规则:你可以在会话列表中选择你要操作的会话,然后右键选择 save。其中 save 菜单下有四个选项

1 Selected Session(选定的会话)
2 Request(请求)
3 Response(响应)
4 ...and Open as local File(作为本地文件打开)

如下图所示:

5.6.1Selected Session

Selected Session(选定的会话) 其下子菜单选项如下:

选项 描述
in ArchiveZIP 把当前所选择的请求会话保存到.saz文件中
as Text 把当前所选择的请求会话保存到文本文件中 包含请求报文+响应报文+响应体
as Text (Headers only) 把当前所选择的请求会话保存到文本文件中 包含请求报文+响应报文
5.6.2Request

Request(请求) 旗下子菜单选项,如下图所示:

各个选项的含义如下表所示:

选项 描述
Entire Request 把当前所选择的请求会话保存到文本文件中 只有请求报文
Request Body 保存当前请求会话请求正文文本文件
5.6.3Response

Response(响应) 子菜单,如下图所示:

各个选项的含义如下表所示:

选项 描述
Entire Response 把当前所选择的请求会话保存到文本文件中 只有响应报文+响应体
Response Body 保存当前请求会话响应体文本文件
5.6.4...and Open as local File

...and Open as local File(作为本地文件打开)

这个选项的意思就是保存为本地的一个 html 文件 并且进行打开!

6.小结

6.1 保存会话乱码问题

我们有时候保存会话查看时,会发现返回的响应体是乱码,如下图所示:

遇到这种问题,主要是需要解码就行了。宏哥这里提供两种方法:

(1)在Inspectors 会话响应中点击Response body is encodee.click to decode后,重新保存就没乱码了。

(2)选中上图会话框上的decode按钮,这样就自动解码了。

解码后的,响应正文没有乱码,如下图所示:

其实如果你已经了解了 http 的基础知识,那么会话列表中的列的信息也会很快的理解! 而且你也不用每一个都去记住,要用的时候来查一查就行了!😉

为了方便大家在移动端也能看到我分享的博文,现已注册个人微信公众号,扫描左下方二维码即可,欢迎大家关注,有时间会及时分享相关技术博文。


↙↙↙阅读原文可查看相关链接,并与作者交流