需结合Network面板高级过滤与控制台日志源头拦截实现双向精简：一、用XHR/JS/Img按钮粗筛；二、用domain:、method:、status-code:等关键词组合过滤；三、启用Waterfall、Transferred等列排序分析；四、通过Initiator和Referer定位请求上下文；五、用Tampermonkey脚本拦截redux-logger.js等日志输出。
如果您在火狐浏览器中已打开Network面板并捕获到大量网络请求，但关键接口被淹没在冗余条目中，同时需同步抑制无关日志干扰调试过程，则需结合Network面板高级过滤与控制台日志源头拦截实现双向精简。以下是针对Network请求精准定位与控制台日志源头过滤的协同操作路径：
一、利用内置分类按钮进行粗粒度筛选
Network面板顶部预设资源类型按钮可快速排除静态资源与非交互类请求，大幅压缩待分析列表规模，为后续深度过滤建立干净起点。
1、点击顶部工具栏中的 XHR 按钮，仅显示 XMLHttpRequest 和 Fetch 发起的 API 请求。
2、点击 JS 按钮，聚焦 JavaScript 文件加载行为，识别潜在脚本注入点。
3、点击 Img 按钮，隔离图片资源请求以排除带宽与缓存干扰项。
二、使用关键词组合式文本过滤
通过结构化表达式在过滤输入框中多维匹配，可一次性收敛至目标请求，避免人工滚动排查遗漏。
1、输入 domain:api.example.com，限定仅显示来自指定域名的请求。
2、输入 method:POST，筛选所有 POST 方法请求，适用于登录、提交等操作追踪。
3、输入 status-code:401，快速定位未授权响应，辅助权限调试。
4、输入 content-type:application/json，过滤出 JSON 格式响应体的请求，便于接口数据结构分析。
5、输入 url:/v1/users.*?id=，使用正则语法匹配含用户ID参数的API路径。
三、启用列排序与自定义列显示
暴露隐藏诊断维度，通过数值排序直观识别异常耗时、体积或协议偏差，支撑性能与兼容性归因。
1、右键点击请求列表顶部栏（如 Name、Method、Domain），勾选“Waterfall”以显示时间轴视图。
2、右键点击顶部栏，启用“Transferred”列，识别传输体积异常偏大的响应，可能指向未压缩资源或冗余数据返回。
3、右键点击顶部栏，启用“Protocol”列，区分 HTTP/1.1 与 HTTP/2 请求，排查协议兼容性问题。
4、点击“Waterfall”列标题，按耗时从长到短排序，定位性能瓶颈请求。
5、点击“Size”列标题，找出响应体最大的前三项，检查是否包含意外的 base64 图像或日志 dump。
四、应用请求上下文过滤器
当页面存在多个异步交互流程时，通过 Initiator 关系链与堆栈溯源，可锁定特定业务逻辑触发的请求簇，排除第三方 SDK 干扰。
1、右键任一请求条目，选择“Reveal in Console”，在控制台中查看该请求由哪行 JavaScript 代码触发。
2、在 Headers 标签页底部展开“Request Headers”，查找 Referer 字段值，确认请求是否源自预期页面。
五、使用 Tampermonkey 脚本过滤指定源文件控制台日志
Firefox 原生不支持 UI 级别隐藏特定文件日志，需通过代理 console 对象截获调用堆栈，在源头阻断黑名单文件的日志输出，确保 Network 面板分析不受 redux-logger 等库日志污染。
1、访问 addons.mozilla.org，搜索并安装 Tampermonkey 扩展。
2、点击地址栏右侧 Tampermonkey 图标 → 选择“创建新脚本”。
3、在编辑器中粘贴以下代码并保存：
```javascript
// ==UserScript==
// @name Console File Filter
// @match *://*/*
// @grant none
// ==/UserScript==
(function() {
const blockedFiles = ["/redux-logger.js", "vendor.bundle.js"];
const originalConsole = window.console;
const proxyConsole = new Proxy(originalConsole, {
get(target, prop) {
if (typeof target[prop] === 'function') {
return function(...args) {
try {
const stack = new Error().stack;
if (stack && blockedFiles.some(file => stack.includes(file))) {
return;
}
} catch (e) {}
return target[prop].apply(originalConsole, args);
};
}
return target[prop];
}
});
window.console = proxyConsole;
}());
```
4、刷新当前页面，控制台将不再显示来自 redux-logger.js 或 vendor.bundle.js 的日志。
