Chrome “Local Overrides” 的本质，就是在浏览器的网络层（Network/Fetch）给某些 URL 打了一个“本地文件映射”的钩子：

1. 你第一次对某资源点 “Save for overrides” 时，DevTools 会

- 通过 DevTools Protocol 的 Network/Fetch 接口让浏览器正常走一次网络请求，

- 在 `Network.responseReceived` → `Network.getResponseBody` 拿到服务器返回的内容，

- 写到你指定的本地 overrides 文件夹里，建立起「原 URL <-> 本地文件」的映射。

2. 之后每次页面加载到这个 URL：

- DevTools 在后台用 CDP 的 Fetch.enable({patterns:…}) 给浏览器注册一个请求拦截器，

- 当浏览器遇到匹配的请求，就触发 `Fetch.requestPaused`，

- DevTools 不让它走向网络，而是读取本地 overrides 目录下对应的文件，

- 用 `Fetch.fulfillRequest` 把文件内容（经过 base64 编码）当作“虚拟的 HTTP 响应”直接发给页面。

3. 如果某次你取消了 overrides 或删掉了本地文件，DevTools 会自动 `Fetch.continueRequest`，让请求恢复到正常的网络流程。

——

归纳下来，Local Overrides 的关键点：

- 利用 Chrome DevTools Protocol（尤其是 Fetch domain）在“请求发出前”／“响应回来后”挂钩；

- “Save for overrides” 时抓一次真响应并存盘；“生效时”直接从本地盘读并用虚拟响应替代网络；

- 对页面、脚本、样式、图片都通用，只要 URL 匹配就能无感替换。

这种机制让你在不动后端、不部署新版本的情况下，随时把线上资源换成本地修改版，刷新就见效。