谷歌浏览器开发者工具Network面板不显示请求数据如何处理

Network面板空白是因录制未开启、缓存跳过请求、过滤器过严、扩展干扰或OPTIONS预检被隐藏；需先开启红点录制并勾选Disable cache和Preserve log，再切All过滤器、试无痕模式，最后禁用OutOfBlink CORS实验选项。

谷歌浏览器开发者工具打开后，Network面板一片空白，刷新页面也看不到任何请求记录，连Name列都空着——这不是网页没发请求，而是Chrome的录制、缓存、过滤或扩展机制在悄悄拦截你的调试视野。

确认Network录制是否真正开启

Network面板默认不自动捕获历史请求，必须手动启动实时录制。右上角那个红色圆点（●）才是关键开关：灰色或带斜杠状态=暂停录制，此时刷新页面绝不会产生任何记录。

单击该红色圆点，确保它变为实心高亮红色；若图标是灰色/空心/带斜杠，说明录制已暂停——这一步不做，后面全白忙。

刷新页面前务必确认此状态，否则所有操作都无效。

启用“Preserve log”并禁用缓存

页面刷新时Network默认清空全部记录，导致你刚看到请求就消失；同时浏览器若从缓存加载资源，根本不会触发真实网络请求。

第一步：在Network面板左上角，勾选【Preserve log】复选框。

第二步：在同一区域，勾选【Disable cache】复选框。

第三步：按 Ctrl+R（Windows）或 Cmd+R（Mac）刷新页面。这两项不启用，即使录制开着，你也大概率只看到零星几条请求或完全空白。

重置过滤器到全量显示

过滤器可能处于隐式激活状态：搜索框残留字符、误选XHR类型、勾选了“Has blocked cookies”等，都会让全部请求被静默过滤掉。

方法一：点击Network左上角漏斗图标 → 清空Filter输入框 → 点击“All”标签 → 取消勾选“Has blocked cookies”、“3rd-party”、“Blocked”三项。

方法二：直接按 Esc 键清空搜索框，再点击“All”，比逐个点更快更可靠。

注意：若只勾选“XHR”，则HTML文档、CSS、JS、图片等请求全部不可见——这是新手最常踩的坑。

排查浏览器扩展与隐身模式干扰

广告拦截器（如uBlock Origin）、隐私增强插件（如Privacy Badger）会主动阻止请求上报至DevTools，造成Network空白假象，且不报错、无提示。

关闭所有扩展：点击Chrome右上角三点菜单 → 更多工具 → 扩展程序 → 将全部开关设为关闭。

新开无痕窗口：按 Ctrl+Shift+N（Windows）或 Cmd+Shift+N（Mac）→ 访问同一网页 → 按F12打开DevTools → 切换到Network → 刷新页面。

若无痕模式下请求正常出现，问题100%出在某个扩展上，无需重装浏览器。

强制显示被隐藏的OPTIONS预检请求

Chrome 76+版本默认不显示CORS预检用的OPTIONS请求，哪怕后端已明确收到，Network里也只显示后续的GET/POST——这会让跨域调试彻底失焦。

在Chrome地址栏输入：chrome://flags/#out-of-blink-cors → 找到“OutOfBlink CORS”实验性选项 → 将其设为【Disabled】 → 重启浏览器。

重启后，跨域场景下的OPTIONS请求将和普通请求一样出现在Network列表中，Header、Response、Timing全部可查。