当前位置: 首页 > news >正文

在Fiddler中添加自定义HTTP方法列并高亮显示

在Fiddler中添加自定义HTTP方法列并高亮显示

Fiddler 是一款强大的 Web 调试代理工具,允许开发者检查和操作 HTTP 流量。一个常见需求是自定义 Web Sessions 列表,添加显示 HTTP 方法(GET、POST 等)的列,并通过颜色区分不同方法。本文将指导你如何在 Fiddler 中添加一个 HTTPMethod 自定义列,并为 POST 请求设置红色背景、GET 请求设置绿色背景。

为什么要自定义 Fiddler?

Fiddler 的 Web Sessions 列表提供了 HTTP 请求和响应的详细信息,但默认列可能无法满足所有需求。例如,你可能希望快速区分 GET 和 POST 请求,并让 POST 请求在调试表单提交或 API 调用时更显眼。通过添加自定义列和高亮显示,你可以优化调试流程,提高效率。

解决方案:使用 FiddlerScript 和 BindUIColumn

我们将使用 FiddlerScript(基于 JScript.NET 的脚本引擎)来添加自定义列并实现颜色高亮。BindUIColumn 方法适合提取 HTTP 方法,而 OnBeforeRequest 钩子可用于根据方法设置颜色。

步骤 1:打开 FiddlerScript 编辑器

  1. 启动 Fiddler(Fiddler Classic 或 Fiddler Everywhere)。
  2. 点击菜单栏的 Rules > Customize Rules(或按 Ctrl+R),打开 CustomRules.js 文件。

步骤 2:添加自定义 HTTPMethod 列

我们使用 BindUIColumn 属性定义一个名为 HTTPMethod 的列,通过自定义函数提取每个会话的 HTTP 方法。

CustomRules.js 中添加以下代码:

public static BindUIColumn("HTTPMethod", 80)
function CalcMethodCol(oS: Session) {if (oS != null && oS.oRequest != null && oS.oRequest.headers != null) {return oS.oRequest.headers.HTTPMethod; // 返回 GET、POST 等}return "N/A"; // 无效会话的默认值
}
  • 说明
    • BindUIColumn("HTTPMethod", 80) 定义列名 HTTPMethod,宽度为 80 像素。
    • CalcMethodCol 函数为每个会话(oS)计算列值。
    • oS.oRequest.headers.HTTPMethod 获取 HTTP 方法(如 GET、POST)。
    • 添加了空值检查,避免异常并返回 "N/A"

步骤 3:高亮 POST 和 GET 请求

为 POST 和 GET 请求设置不同背景色,我们修改 OnBeforeRequest 函数,根据 HTTP 方法设置会话颜色。

CustomRules.js 中添加或更新以下代码:

public static RulesOption("高亮 POST 请求")
var m_HighlightPost: boolean = true;static function OnBeforeRequest(oSession: Session) {if (m_HighlightPost && oSession.HTTPMethodIs("POST")) {oSession["ui-color"] = "red"; // POST 请求背景设为红色} else if (m_HighlightPost && oSession.HTTPMethodIs("GET")) {oSession["ui-color"] = "green"; // GET 请求背景设为绿色}
}
  • 说明
    • RulesOption("高亮 POST 请求")Rules 菜单中添加一个可切换选项,控制高亮功能。
    • m_HighlightPost 是一个布尔标志,用于启用或禁用高亮。
    • OnBeforeRequest 在处理每个请求前运行。
    • oSession.HTTPMethodIs("POST") 检查是否为 POST 请求,oSession["ui-color"] = "red" 将背景设为红色。
    • GET 请求同样被设置为绿色。
    • ui-color 属性控制 Web Sessions 列表中的背景颜色。

步骤 4:保存并测试

  1. 保存 CustomRules.js 文件。
  2. Fiddler 通常会自动重新加载脚本。如未生效,重启 Fiddler 或重新打开 Customize Rules
  3. 发起一些 HTTP 请求(例如浏览网页、提交表单,或使用 curl 发送 GET 和 POST 请求)。
  4. 在 Web Sessions 列表中检查:
    • 新增的 HTTPMethod 列应显示方法(如 GET、POST)。
    • POST 请求显示红色背景,GET 请求显示绿色背景。

示例效果

应用脚本后,Web Sessions 列表可能如下:

  • GET /index.htmlHTTPMethod 列显示 GET,行背景为绿色。
  • POST /submit-formHTTPMethod 列显示 POST,行背景为红色。
  • 无效会话HTTPMethod 列显示 N/A,无颜色。

故障排除

如果列或颜色未按预期工作,尝试以下步骤:

  • 列值为空:确认 oS.oRequest.headers.HTTPMethod 可访问。添加调试日志检查值:

    FiddlerObject.log("HTTP 方法: " + oS.oRequest.headers.HTTPMethod);
    

    Log 面板查看输出。

  • 颜色未生效:验证 oSession.HTTPMethodIs("POST") 是否正常工作。测试一个已知的 POST 请求(如表单提交)。

  • 脚本错误:检查 Log 面板中的语法错误,修复 CustomRules.js 中的问题。

  • Fiddler 版本:确保使用最新版本的 Fiddler Classic 或 Fiddler Everywhere,脚本支持可能因版本而异。

为什么选择 BindUIColumn?

最初尝试使用 AddBoundColumn 配合 @method@request.Method,但这些方法有时因字段不可用或版本差异导致值为空。BindUIColumn 更可靠,因为它通过自定义函数显式控制列值,确保兼容性和稳定性。

结论

通过在 Fiddler 中添加 HTTPMethod 自定义列和高亮显示,你可以更高效地分析 HTTP 流量。BindUIColumn 结合 OnBeforeRequest 的方法为 Fiddler 的功能扩展提供了强大支持。这对调试 API、Web 表单或复杂 Web 应用尤为有用。

你可以进一步扩展脚本,例如为 PUT、DELETE 等方法添加支持,或调整颜色以适应个人偏好。祝调试愉快!


于 2025 年 5 月 8 日在 Fiddler Classic 上测试。对于 Fiddler Everywhere,请参考官方文档确认脚本差异。

最后效果查看:在这里插入图片描述

http://www.xdnf.cn/news/344503.html

相关文章:

  • 姚琛全新特别版EP上线 携手金牌制作人诠释夏日浪漫
  • easyexcel导出动态写入标题和数据
  • 高频交直流传感技术在射频器件与微系统测试中的创新实践
  • TCP/IP和OSI对比
  • 【微信小程序开发】从0开始的一点点小记录
  • 并发与并行的关系
  • Java高频面试之并发编程-14
  • vue v-html无法解析<
  • 负载均衡算法解析(一)NGINX
  • 闪回查询和闪回表
  • es 里的Filesystem Cache 理解
  • [工具分享]欧拉角-四元数可视化工具
  • 科技成果鉴定测试有哪些内容?又有什么作用?
  • 美信监控易:网络设备智能识别与运维系统快捷配置
  • PostgreSQL 的 pg_current_logfile 函数
  • 利用session在html和MySQL实现登录
  • MySQL 8.0 OCP认证考试题库持续更新
  • 树状数组的操作问题--Python
  • SSL证书管理系统GO中文版自动申请SSL证书部署自动续期域名列表授权管理源码
  • 亚马逊推出新型仓储机器人 Vulcan:具备“触觉”但不会取代人类工人
  • V4L2应用程序开发-- 控制流程
  • Python爬虫中time.sleep()与动态加载的配合使用
  • C#串口通信
  • 国内led显示屏厂家以及售后 消费对比与选择
  • 高效文件夹迁移工具,轻松实现批量文件管理
  • CSS相对定位与绝对定位
  • 前端基础之《Vue(15)—组件通信(2)》
  • Cut video with ffmpeg
  • 创建型模式:工厂方法(Factory Method)模式
  • 最新CDGP单选题(第四章)补充