一个纯前端的 Chrome 插件：不搭代理，也能把接口返回编圆

标题用上面这一行。标签：前端 Chrome Chrome插件 Mock

摘要：DL Debugger 是个 Chrome 浏览器插件，装上就能改请求头、换接口返回。不用搭 Mock 服务，不用开代理，调试全在浏览器里完成。

它是个 Chrome 插件，不是又一个要你本地起服务的调试工具。

装到浏览器里，弹窗配好规则，刷新页面就生效。请求头和接口返回都由浏览器自己改，走的是 Manifest V3 的 declarativeNetRequest。没有代理进程，没有证书，也不用把接口先转到一台 Mock 服务器上。纯前端调试：你改的是浏览器里看到的请求，业务代码一行都不用动。

后端说接口下午就好的时候，最怕两件事。一是在代码里写假数据，发誓联调完就删，三个迭代后它还在，而且被人修过两次 bug。二是把 swimlane 写死在拦截器里，提交前再从 diff 里捞出来，像在行李箱里翻一只跑丢的袜子。

Charles 能做，但为了一个 JSON 让你开代理、装证书。这个插件把这件事留在 Chrome 里。

DL Debugger，v2.0.3，MIT。

就两件事

贴请求头。 填名称、值，再写一句备注，免得两周后不认识自己。同名头自动互斥，两个 Token 一起出门，服务器只会更困惑。

替换接口返回。 选方法、填路径、写 JSON。命中之后请求不打后端，页面拿到的是你编的。有命中次数，至少能证明刚才那下刷新，它真上场了。

规则按 Host 分组，*.example.com 和 localhost:8888 都能写。打开弹窗会自动对上当前页面。总开关一键暂停，配置还在。能导出 JSON，丢给同事比微信发「你把这个头加上」靠谱。

三分钟装上

1. 下载 DL-debugger-2.0.3.zip，解压。不用 npm install，更不用起服务。
2. 打开 chrome://extensions/，开发者模式，加载已解压的扩展程序，选 dist。
3. 点扩展图标，加 Host，配头或者配 JSON，刷新。

路径末尾会自动补 *。写 /api/user 也会打中 /api/user/1。这个星号很热心，想打得准就把路径写完整。

它会装忙的地方

状态码只有 200。401、500 请另请 Charles，这个插件只负责把成功响应编圆。它是整段换掉，不是在真响应上改一个字段。返回体别写太胖，接口 JSON 没事，文件下载就别来了。

想看它怎么在浏览器里把请求拐走，去 GitHub。用得不顺就提 Issue，骂得具体一点，我改得更快。