XHR/fetch断点是在fetch()或XMLHttpRequest.send()调用的第一行JS代码处暂停，用于调试请求逻辑而非拦截网络请求；需在Sources面板的XHR/fetch Breakpoints中添加URL匹配规则，支持子字符串匹配，留空则捕获所有请求。
在 Chrome DevTools 中，XHR/fetch Breakpoints 并不能真正“拦截请求发送时点”，而是让代码在 XMLHttpRequest.send() 或 fetch() 调用开始执行的**第一行 JS 代码处暂停**（即进入 debugger），从而让你有机会 inspect 请求参数、修改变量、或单步调试发起逻辑。它不阻塞网络层，也不修改请求本身，本质是 JS 执行断点。
如何设置 XHR/fetch 断点
打开 DevTools → Sources 面板 → 左侧边栏展开 XHR/fetch Breakpoints（若不可见，点击右上角 ⋯ → Show navigator）→ 点击 + 号：
- 输入完整 URL 或路径片段（如
/api/user、login），支持子字符串匹配（不区分大小写） - 留空则匹配所有 XHR/fetch 请求
- 勾选 XHR breakpoint 拦截
XMLHttpRequest.send() - 勾选 Fetch/XHR breakpoint 拦截
fetch()（Chrome 98+ 默认启用，旧版需手动开启实验功能）
它在哪暂停？不是在 Network 里拦包
断点触发位置是JS 调用栈最上层的 fetch/XHR 发起代码行，例如：
function loadUser() {
fetch('/api/user?id=123') // ← 断点停在这里（调用 fetch 的那一行）
.then(r => r.json())
}
而不是停在 fetch 内部实现、或 Network 面板的请求发出瞬间。你无法在此修改 headers 或 body（因为 fetch 参数已传入，且不可变），但可以：
dmap-jsapi-skill
下载
DMap GL地图JSAPI（dmapgl）开发指南。用于编写、审查、调试 DMap 地图 API 代码，涵盖地图初始化、覆盖物渲染、图层管理、事件处理、控件交互等任务。当用户提及 dmap、dmapgl、jsapi‑gl 或相关地图开发需求时自动触发。
- 查看
arguments[0]（URL）和arguments[1]（init 对象） - 在 Console 中临时 patch
window.fetch = new Proxy(...)进行拦截重写（需手动） - 检查闭包变量（如 token、query 构造逻辑）是否符合预期
为什么有些 fetch 不被断点捕获？
常见原因包括：
- 请求由第三方库（如 axios、swr、RTK Query）封装，实际调用的是其内部的
fetch或XMLHttpRequest，但断点规则匹配的是原始 URL —— 确保你填的是最终发出的 URL，不是封装前的 path - 使用了
AbortController或 polyfill（如 unfetch），部分 polyfill 不走原生 fetch 调用链，断点无效 - 代码被压缩/混淆，DevTools 无法准确映射到源码行（可尝试启用 Enable JavaScript source maps）
- 请求在 Worker 或 iframe 中发起，主页面的 XHR/fetch 断点默认不生效（需单独打开对应上下文的 DevTools）
更灵活的替代方案：手动注入拦截
若需真正修改、延迟、或条件性阻止请求，推荐在全局 JS 中提前 patch：
// 在页面最早期执行（如 snippet 或 console 直接粘贴）
const originalFetch = window.fetch;
window.fetch = function(url, options) {
if (url.includes('/api/admin')) {
debugger; // 此处会触发断点，且可修改 url/options
}
return originalFetch.apply(this, arguments);
};
这种方式完全可控，支持动态判断、改参、mock 返回，也适用于 Service Worker 场景。
