API Probe：网页API请求录制探测浏览器插件

作品简介

API Probe 是一个 Manifest V3 的 Chrome 浏览器扩展（当前版本 1.8.0），核心能力是录制并探测网页中发出的 API 请求，自动分析端点、参数和响应格式，让开发者不必翻 DevTools 就能看清页面背后的接口调用。

扩展由 background.js 后台服务工作线程、content.js（注入页面 MAIN 环境）与 bridge.js（注入 ISOLATED 环境）协同工作，通过 sidepanel 侧边栏界面展示探测结果；申请了 storage、sidePanel、scripting 权限及全部 HTTP/HTTPS 站点的主机权限，可在任意网页上捕获网络请求。

核心亮点

• 一键录制网页请求：按标签页隔离录制，实时列出请求的方法、状态码、地址与耗时，支持导出与清空
• 多维过滤：按 GET/POST/PUT/DELETE 等方法以及 REST、GraphQL、SSE、WebSocket、Socket.IO、MQTT 等协议类型筛选，还可按 URL 关键字搜索
• Events 事件面板：记录页面的点击、悬停、导航、可见性变化等用户操作事件，方便把「哪个操作触发了哪个请求」对应起来
• 内置请求构造器：手动新建 REST/GraphQL/WebSocket 等请求，配置 Query 参数、Auth、Headers 与 JSON Body 直接发送调试
• 环境管理：支持环境变量配置，录制数据可复用到不同调试场景
• 侧边栏可视化：探测结果在浏览器侧边栏直接呈现，边浏览边看接口

技术与工具

• Manifest V3 扩展架构：background service worker + content script 双环境（MAIN / ISOLATED）注入 + bridge 通信
• 使用 Chrome 的 storage、sidePanel、scripting API 与 host_permissions 实现全站请求捕获
• 零基础作者借助办公智能体工具与国内顶级模型，在浏览器插件技能（browser skill）的指导下完成

适用场景

• 网页开发者快速调试接口、理解第三方网站或自己项目的前后端交互逻辑
• 测试人员抓取并验证网页接口调用情况，配合事件时间线定位问题
• 数据分析人员探查页面数据来源接口，为采集方案做前期调研

原始提交内容（点开查看，可复制全文去问 AI）

这是一个名为 API Probe 的 Chrome 浏览器扩展程序（Manifest V3，当前版本 1.8.0），它的核心功能是录制并探测网页中发出的 API 请求，自动分析端点、参数和响应格式，帮助开发者快速理解和调试网页背后的接口。该扩展通过 background.js 后台服务工作线程、content.js（注入到页面 MAIN 环境）与 bridge.js（注入到 ISOLATED 环境）协同工作，并配合 sidepanel.html 侧边栏界面展示探测结果；它申请了 storage、sidePanel、scripting 权限以及对所有 HTTP/HTTPS 站点的 host_permissions，以便在任意网页上捕获网络请求并以可视化方式呈现。