Chrome 扩展
Compare JSON - Diff API Responses 是一个 Chrome 扩展,可以在任意页面上捕获 JSON API 响应,并在 comparejson.com 上对比其中任意两个——无需再从 DevTools 里复制粘贴。
安装
从 Chrome 应用商店安装,然后将其固定到工具栏以便快速访问。
捕获 API 响应
- 点击工具栏上的扩展图标打开弹窗。
- 点击 Start 按钮(▶)开始收集。从此刻起,页面通过
fetch或XMLHttpRequest收到的每个 JSON 响应都会被捕获——跨所有标签页生效。工具栏图标上的角标会显示已捕获的响应数量。 - 正常使用 Web 应用即可。直接访问
.jsonURL(由 Chrome 内置 JSON 查看器渲染)也会被捕获。
弹窗列表中的每个条目都会显示捕获响应的 HTTP 状态码、请求方法和 URL。
对比两个响应
- 点击一个条目,将其标记为 Base(差异视图的左侧)。
- 点击另一个条目,将其标记为 Contrast(差异视图的右侧)。再次点击已标记的条目可取消标记。
- 点击 Compare。扩展会在新标签页中打开 comparejson.com 的对比结果——两个响应体会直接传递给页面,不会上传到任何服务器。
置灰的条目无法选择:要么响应体不可读,要么超过了 2 MB 的捕获上限。
弹窗控件
- Start / Pause —— 开启或暂停收集。收集状态在浏览器重启后仍然保留。
- Clear —— 清空所有已捕获的响应。
- Keep N —— 最多保留多少个响应(1–1000,默认 100)。达到上限时,最旧的条目会被丢弃。
- Reset —— 清除当前的 Base/Contrast 选择。
隐私
捕获的响应仅保存在浏览器的会话存储中,浏览器关闭时即被清除。点击 Compare 时,选中的两个响应体通过 Chrome 扩展消息机制直接传递给 comparejson.com 标签页——不会经过任何第三方服务器。