17370845950

谷歌浏览器怎么在开发者工具中屏蔽某个请求_Chrome开发者工具请求屏蔽方法
首先在Chrome开发者工具Network面板右键请求选择Block request URL屏蔽指定资源,其次可通过Network Conditions添加自定义屏蔽规则,最后还可使用Sources面板的XHR/fetch断点动态拦截请求。

如果您在调试网页时希望阻止某些特定的网络请求加载,以测试页面行为或排查性能问题,Chrome 开发者工具提供了便捷的方式实现请求屏蔽。通过配置拦截规则,可以有效地阻止指定资源的加载。

本文运行环境:MacBook Pro,macOS Sonoma

一、使用开发者工具屏蔽请求

Chrome 开发者工具中的“Network”面板支持阻止特定请求的功能,通过启用请求拦截并添加匹配规则即可实现屏蔽。

1、按下 F12 或右键页面选择“检查”打开开发者工具。

2、切换到 Network 选项卡,确保网络请求列表已开始记录。

3、找到您想要屏蔽的请求,右键该请求项。

4、在弹出菜单中选择 Block request URLBlock request domain

5、刷新页面后,被标记的请求将自动被浏览器拦截且不再发送。

二、自定义屏蔽规则

除了通过右键快速屏蔽外,还可以在“Network Conditions”或“Recorder”模块中管理更详细的屏蔽规则,适用于复杂调试场景。

1、打开开发者工具后,点击右上角的三个点菜单,选择 More tools > Network conditions

2、在“Blocked URLs”标签页中,点击 Add 按钮。

3、输入需要屏蔽的完整 URL 或域名,例https://example.com/analytics.js

4、勾选对应规则的启用状态,刷新页面即可生效。

5、如需删除规则,选中条目后点击 Remove 按钮即可。

三、通过断点方式拦截请求

对于需要动态控制的请求,可使用“Fetch/XHR Breakpoints”功能,在请求发出时中断并决定是否继续执行。

1、切换至开发者工具的 Sources 面板。

2、展开下方的 XHR/fetch breakpoints 区域。

3、点击 + Add breakpoint,输入目标请求的部分或完整 URL 路径。

4、当页面发起匹配的请求时,执行会暂停,此时可在调用栈中分析来源,并手动控制是否放行。