[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"project-81192":3},{"id":4,"name":5,"fullName":6,"owner":7,"repo":5,"description":8,"homepage":9,"htmlUrl":9,"language":10,"languages":9,"totalLinesOfCode":9,"stars":11,"forks":12,"watchers":13,"openIssues":14,"contributorsCount":14,"subscribersCount":14,"size":14,"stars1d":14,"stars7d":15,"stars30d":15,"stars90d":14,"forks30d":14,"starsTrendScore":14,"compositeScore":16,"rankGlobal":9,"rankLanguage":9,"license":9,"archived":17,"fork":17,"defaultBranch":18,"hasWiki":17,"hasPages":17,"topics":19,"createdAt":9,"pushedAt":9,"updatedAt":20,"readmeContent":21,"aiSummary":22,"trendingCount":14,"starSnapshotCount":14,"syncStatus":23,"lastSyncTime":24,"discoverSource":25},81192,"packet-capture-extension","hailaobao2026\u002Fpacket-capture-extension","hailaobao2026","这个是基于chrome浏览器插件的抓包工具基于基于 chrome.debugger (CDP) 捕获完整请求\u002F响应",null,"JavaScript",28,10,27,0,1,40.72,false,"main",[],"2026-06-12 04:01:32","# 抓包归档 - Chrome Extension\r\n\r\n> 基于 Chrome DevTools Protocol (CDP) 的 HTTP 请求抓包、会话归档、多格式导出与 AI 解读工具。零依赖，无需打开 DevTools，加载即用。\r\n\r\n![Chrome Extension](https:\u002F\u002Fimg.shields.io\u002Fbadge\u002FChrome%20Extension-MV3-4285F4?logo=googlechrome&logoColor=white)\r\n![JavaScript](https:\u002F\u002Fimg.shields.io\u002Fbadge\u002FJavaScript-Vanilla-F7DF1E?logo=javascript&logoColor=000)\r\n![Version](https:\u002F\u002Fimg.shields.io\u002Fbadge\u002Fversion-v0.0.2-green.svg)\r\n![License](https:\u002F\u002Fimg.shields.io\u002Fbadge\u002Flicense-MIT-blue.svg)\r\n\r\n## 项目介绍\r\n\r\n`packet-capture-extension` 是一个面向 Web 调试、接口分析、业务流程归档和自动化测试辅助的 Chrome 扩展。项目通过 `chrome.debugger` 接入 CDP Network 事件，捕获当前标签页的请求、响应头、请求体、响应体、状态码、耗时和失败信息，并将数据按会话保存到 IndexedDB。\r\n\r\n相比 `chrome.webRequest`，本项目可以获取完整响应体；相比 `chrome.devtools.network`，本项目无需打开 DevTools，更适合日常调试、指纹浏览器环境和批量流程录制。\r\n\r\n## 功能清单\r\n\r\n| 功能名称 | 功能说明 | 技术栈 | 状态 | 版本 |\r\n|---------|---------|--------|------|------|\r\n| 实时抓包 | 捕获 URL、Method、Headers、Body、状态码、耗时、失败信息 | CDP \u002F `chrome.debugger` | ✅ 已完成 | v0.0.1 |\r\n| 响应体获取 | 通过 `Network.getResponseBody` 读取完整响应内容 | Chrome DevTools Protocol | ✅ 已完成 | v0.0.1 |\r\n| 会话归档 | 每次抓包自动创建会话，支持历史查看、删除、导出 | IndexedDB | ✅ 已完成 | v0.0.1 |\r\n| 请求过滤 | 按 URL、HTTP 方法、状态码实时过滤请求 | Vanilla JS | ✅ 已完成 | v0.0.1 |\r\n| 请求详情 | 查看 General、Request Headers、Request Body、Response Headers、Response Body | HTML \u002F CSS \u002F JS | ✅ 已完成 | v0.0.1 |\r\n| HAR 导出 | 导出 HAR 1.2，可导入 DevTools、Charles、Fiddler | JSON \u002F Downloads API | ✅ 已完成 | v0.0.1 |\r\n| JSON 导出 | 导出原始抓包数据，方便二次处理 | JSON \u002F Downloads API | ✅ 已完成 | v0.0.1 |\r\n| AI 解读 | 将当前会话摘要发送给大模型，生成业务链路、接口用途、异常风险和排查建议 | Fetch API | ✅ 已完成 | v0.0.1 |\r\n| 单条请求 AI 分析 | 选中任意请求后单独分析该请求和响应，便于理解接口用途与返回字段 | Fetch API | ✅ 已完成 | v0.0.2 |\r\n| 多模型接入 | 支持 OpenAI 兼容接口、Anthropic Claude 接口、自定义 Base URL 和独立模型列表 URL | `\u002Fv1\u002Fchat\u002Fcompletions` \u002F `\u002Fv1\u002Fmessages` | ✅ 已完成 | v0.0.2 |\r\n| 敏感信息脱敏 | 默认遮蔽 Cookie、Authorization、token、password、session 等字段 | 本地规则 | ✅ 已完成 | v0.0.1 |\r\n| 状态恢复 | Service Worker 重启后自动恢复抓包状态 | `chrome.storage.local` \u002F `chrome.alarms` | ✅ 已完成 | v0.0.1 |\r\n\r\n## 技术方案对比\r\n\r\n| 方案 | API | 可获取响应体 | 是否需要打开 DevTools | 是否有调试提示 |\r\n|------|-----|:------------:|:----------------------:|:--------------:|\r\n| **本项目** | `chrome.debugger` (CDP) | ✅ 完整 | ❌ 不需要 | ⚠️ 顶部黄色提示条 |\r\n| `chrome.webRequest` | Extension WebRequest API | ❌ 不可获取 | ❌ 不需要 | ✅ 无 |\r\n| `chrome.devtools.network` | DevTools Extension API | ✅ 完整 | ✅ 需要 | ✅ 无 |\r\n\r\n选择 CDP 方案原因：在不打开 DevTools 的情况下获取完整请求和响应数据。\r\n\r\n## 安装说明\r\n\r\n### 环境要求\r\n\r\n- Google Chrome \u002F Chromium 100+\r\n- 支持 Manifest V3 的 Chromium 内核浏览器\r\n- 已开启扩展「开发者模式」\r\n- 无需 Node.js、无需构建、无需安装依赖\r\n\r\n### 安装步骤\r\n\r\n```bash\r\n# 克隆项目\r\ngit clone https:\u002F\u002Fgithub.com\u002Fhailaobao2026\u002Fpacket-capture-extension.git\r\ncd packet-capture-extension\r\n```\r\n\r\n然后在浏览器中加载扩展：\r\n\r\n1. 打开 `chrome:\u002F\u002Fextensions\u002F`\r\n\r\n2. 开启右上角「开发者模式」\r\n\r\n3. 点击「加载已解压的扩展程序」\r\n\r\n4. 选择本项目根目录\r\n\r\n5. 工具栏出现「抓包归档」图标，即可使用\r\n\r\n   ![](https:\u002F\u002Fmypicture-1258720957.cos.ap-nanjing.myqcloud.com\u002FObsidian\u002Fimage-20260512195245796.png)\r\n\r\n![](https:\u002F\u002Fmypicture-1258720957.cos.ap-nanjing.myqcloud.com\u002FObsidian\u002Fimage-20260512195332025.png)\r\n\r\n![](https:\u002F\u002Fmypicture-1258720957.cos.ap-nanjing.myqcloud.com\u002FObsidian\u002Fimage-20260512195412670.png)\r\n\r\n## 使用说明\r\n\r\n### 快速开始\r\n\r\n```text\r\n点击扩展图标 → 开始抓包 → 在页面执行操作 → 停止抓包 → 查看详情 \u002F 导出 HAR \u002F 导出 JSON \u002F AI 分析\r\n```\r\n\r\n### 实时抓包\r\n\r\n1. 打开需要分析的目标页面\r\n2. 点击扩展图标\r\n3. 点击「开始抓包」\r\n4. 在页面中执行登录、搜索、下单、提交表单等操作\r\n5. 点击「停止抓包」结束捕获\r\n6. 在列表中点击任意请求查看详情\r\n\r\n> 抓包期间浏览器顶部会显示调试提示条，这是 Chrome Debugger API 的系统行为，无法由扩展隐藏。\r\n\r\n\r\n\r\n![image-20260512223223840](https:\u002F\u002Fmypicture-1258720957.cos.ap-nanjing.myqcloud.com\u002FObsidian\u002Fimage-20260512223223840.png)\r\n\r\n生成图片后\r\n\r\n![image-20260512223318398](https:\u002F\u002Fmypicture-1258720957.cos.ap-nanjing.myqcloud.com\u002FObsidian\u002Fimage-20260512223318398.png)\r\n\r\n抓取请求的数据包\r\n\r\n### 过滤请求\r\n\r\n- **搜索框**：按 URL 关键词过滤\r\n- **方法过滤**：GET \u002F POST \u002F PUT \u002F DELETE \u002F PATCH\r\n- **状态码过滤**：2xx \u002F 3xx \u002F 4xx \u002F 5xx\r\n\r\n### 查看请求详情\r\n\r\n点击请求列表中的任意记录，详情面板会展示：\r\n\r\n- General：URL、方法、状态、资源类型、耗时、大小\r\n- Request Headers\r\n- Request Body\r\n- Response Headers\r\n- Response Body（JSON 自动格式化）\r\n\r\n### 导出数据\r\n\r\n| 按钮 | 输出格式 | 适用场景 |\r\n|------|----------|----------|\r\n| 导出 HAR | HAR 1.2 | 导入 Chrome DevTools、Charles、Fiddler、HAR 分析工具 |\r\n| 导出 JSON | 原始请求数组 | 脚本分析、归档、AI 二次处理、测试回放 |\r\n\r\n![image-20260512223516388](https:\u002F\u002Fmypicture-1258720957.cos.ap-nanjing.myqcloud.com\u002FObsidian\u002Fimage-20260512223516388.png)\r\n\r\n![image-20260512223545799](https:\u002F\u002Fmypicture-1258720957.cos.ap-nanjing.myqcloud.com\u002FObsidian\u002Fimage-20260512223545799.png)\r\n\r\n### AI 解读\r\n\r\n1. 切换到「AI解读」标签页\r\n\r\n2. 选择模型厂商：\r\n   - **OpenAI 兼容**：默认 `https:\u002F\u002Fapi.openai.com`，也支持 NewAPI、OneAPI、自建网关等兼容地址\r\n   - **Anthropic Claude**：默认 `https:\u002F\u002Fapi.anthropic.com`\r\n   \r\n3. 填写 `Base URL`、`API Key` 和模型名\r\n\r\n4. 如模型调用地址和模型列表地址不同，可填写「模型列表 URL」；留空则使用 `Base URL`\r\n\r\n5. 可点击「获取模型列表」拉取模型，并从下拉列表中选择一个模型；如接口不支持列表，可选择「自定义输入...」\r\n\r\n   ![image-20260512223823532](https:\u002F\u002Fmypicture-1258720957.cos.ap-nanjing.myqcloud.com\u002FObsidian\u002Fimage-20260512223823532.png)\r\n\r\n6. 按需调整：\r\n   - 发送请求\u002F返回 Body\r\n   - 脱敏敏感字段\r\n   - 最多请求数\r\n   \r\n7. 点击「AI分析」或「分析当前会话」生成结论\r\n\r\n也可以在「实时抓包」列表中点击某一条请求，展开详情后点击「AI分析此请求」，只分析该条请求和响应内容。\r\n\r\n示例：如果模型调用必须走 `https:\u002F\u002Fcoding.dashscope.aliyuncs.com\u002Fv1`，但模型列表需要走其他 OpenAI 兼容接口，可这样配置：\r\n\r\n```text\r\nBase URL：https:\u002F\u002Fcoding.dashscope.aliyuncs.com\u002Fv1\r\n模型列表 URL：https:\u002F\u002Fdashscope.aliyuncs.com\u002Fcompatible-mode\u002Fv1\u002Fmodels\r\n```\r\n\r\n> 安全提示：AI 解读会把抓包摘要发送到你配置的模型接口。分析包含账号、Cookie、Token 或业务敏感信息的流量时，请保持「脱敏敏感字段」开启，或使用可信的自建模型网关。\r\n\r\n![image-20260512224516815](https:\u002F\u002Fmypicture-1258720957.cos.ap-nanjing.myqcloud.com\u002FObsidian\u002Fimage-20260512224516815.png)\r\n\r\n### 历史归档\r\n\r\n切换到「历史归档」标签页，可查看历史抓包会话。每个会话包含：\r\n\r\n- 抓包时间和名称\r\n- 请求总数\r\n- 持续时间\r\n- 查看请求\r\n- 导出 HAR\r\n- 删除会话\r\n\r\n## 配置说明\r\n\r\n### 扩展权限\r\n\r\n`manifest.json` 中声明的主要权限：\r\n\r\n| 权限 | 用途 |\r\n|------|------|\r\n| `debugger` | 通过 CDP 捕获网络请求和响应体 |\r\n| `storage` | 保存抓包状态和 AI 配置 |\r\n| `tabs` | 获取当前标签页信息 |\r\n| `activeTab` | 对当前活动标签页执行抓包 |\r\n| `alarms` | 周期唤醒 Service Worker，辅助状态恢复 |\r\n| `downloads` | 下载 HAR \u002F JSON 文件 |\r\n| `\u003Call_urls>` | 捕获目标页面发出的跨域请求 |\r\n\r\n### AI 配置项\r\n\r\n配置保存在本机浏览器 `chrome.storage.local` 的 `aiConfig` 中：\r\n\r\n```js\r\n{\r\n  provider: 'openai' | 'anthropic',\r\n  baseUrl: 'https:\u002F\u002Fapi.openai.com',\r\n  modelsBaseUrl: '',\r\n  apiKey: 'sk-...',\r\n  model: 'gpt-4o-mini',\r\n  includeBodies: true,\r\n  redactSensitive: true,\r\n  maxRequests: 40\r\n}\r\n```\r\n\r\n## 项目结构\r\n\r\n```text\r\npacket-capture-extension\u002F\r\n├── manifest.json       # Manifest V3 清单，声明权限和入口\r\n├── background.js       # Service Worker：CDP 抓包、存储、导出、AI 调用\r\n├── popup.html          # Popup 页面：实时抓包 \u002F 历史归档 \u002F AI 解读\r\n├── popup.css           # 暗色 DevTools 风格 UI 样式\r\n├── popup.js            # Popup 交互、过滤、详情、下载、AI 配置\r\n├── CLAUDE.md           # 项目维护说明\r\n├── .gitignore\r\n└── README.md\r\n```\r\n\r\n## 技术栈\r\n\r\n| 技术 | 版本 \u002F 形态 | 用途 |\r\n|------|-------------|------|\r\n| Chrome Extension | Manifest V3 | 扩展运行框架 |\r\n| JavaScript | Vanilla JS | 业务逻辑、UI 交互、后台脚本 |\r\n| HTML \u002F CSS | 原生 | Popup 页面和暗色主题 |\r\n| Chrome DevTools Protocol | Network Domain | 请求\u002F响应捕获、响应体读取 |\r\n| `chrome.debugger` | Extension API | 附加目标 Tab 并接收 CDP 事件 |\r\n| IndexedDB | 浏览器内置 | 持久化 sessions 和 requests |\r\n| `chrome.storage.local` | Extension API | 保存抓包状态与 AI 配置 |\r\n| `chrome.downloads` | Extension API | 下载 HAR \u002F JSON 文件 |\r\n| Fetch API | 浏览器内置 | 调用 OpenAI 兼容和 Anthropic 接口 |\r\n\r\n## 架构设计\r\n\r\n```text\r\n┌──────────┐  sendMessage  ┌──────────────┐  CDP Events  ┌───────────┐\r\n│  Popup   │ ◄──────────► │  Service     │ ◄──────────► │ Chrome    │\r\n│  (UI)    │              │  Worker      │              │ Tab       │\r\n└──────────┘              └──────┬───────┘              └───────────┘\r\n                                 │\r\n                     ┌───────────┴───────────┐\r\n                     ▼                       ▼\r\n              ┌─────────────┐        ┌───────────────┐\r\n              │  IndexedDB  │        │ AI Model API  │\r\n              │  sessions   │        │ OpenAI\u002FClaude │\r\n              │  requests   │        │ Compatible    │\r\n              └─────────────┘        └───────────────┘\r\n```\r\n\r\n### CDP 事件链路\r\n\r\n1. `Network.requestWillBeSent`：记录 URL、Method、Request Headers、Request Body\r\n2. `Network.responseReceived`：记录状态码、Response Headers、Content-Type\r\n3. `Network.loadingFinished`：调用 `Network.getResponseBody` 获取响应体并持久化\r\n4. `Network.loadingFailed`：记录失败请求和错误原因\r\n\r\n### 消息协议\r\n\r\n| Action | 方向 | 说明 |\r\n|--------|------|------|\r\n| `startCapture` | Popup → Service Worker | 开始抓包 |\r\n| `stopCapture` | Popup → Service Worker | 停止抓包 |\r\n| `getStatus` | Popup → Service Worker | 获取抓包状态 |\r\n| `getRequests` | Popup → Service Worker | 查询请求列表 |\r\n| `getRequestDetail` | Popup → Service Worker | 获取单个请求详情 |\r\n| `getSessions` | Popup → Service Worker | 获取历史会话 |\r\n| `exportHAR` | Popup → Service Worker | 生成 HAR 数据 |\r\n| `exportJSON` | Popup → Service Worker | 生成 JSON 数据 |\r\n| `listAIModels` | Popup → Service Worker | 获取模型列表 |\r\n| `analyzeCapture` | Popup → Service Worker | 汇总抓包并调用模型分析 |\r\n| `analyzeRequest` | Popup → Service Worker | 对单条请求调用模型分析 |\r\n| `clearRequests` | Popup → Service Worker | 清空请求数据 |\r\n| `deleteSession` | Popup → Service Worker | 删除会话及关联请求 |\r\n\r\n## 开发指南\r\n\r\n### 本地开发\r\n\r\n本项目无构建步骤，直接修改源码后重新加载扩展即可。\r\n\r\n```bash\r\n# 查看项目文件\r\nls\r\n\r\n# 修改源码\r\nvim background.js\r\nvim popup.js\r\nvim popup.html\r\nvim popup.css\r\n```\r\n\r\n生效方式：\r\n\r\n- 修改 `background.js` 或 `manifest.json`：在 `chrome:\u002F\u002Fextensions\u002F` 点击扩展卡片的刷新按钮\r\n- 修改 `popup.html` \u002F `popup.css` \u002F `popup.js`：关闭并重新打开扩展 Popup\r\n- 修改权限配置：需要重新加载扩展\r\n\r\n### 调试建议\r\n\r\n- Popup 调试：右键扩展弹窗 → 检查\r\n- Service Worker 调试：`chrome:\u002F\u002Fextensions\u002F` → 找到扩展 → 点击 Service Worker 链接\r\n- 抓包冲突：抓包期间避免对同一 Tab 打开 DevTools，可能导致 Debugger 冲突\r\n\r\n### 构建部署\r\n\r\n当前无需构建。发布压缩包时，建议包含：\r\n\r\n```text\r\nmanifest.json\r\nbackground.js\r\npopup.html\r\npopup.css\r\npopup.js\r\nREADME.md\r\nLICENSE\r\n```\r\n\r\n不建议包含 `.git\u002F`、临时文件、测试导出数据和本地配置。\r\n\r\n### 贡献指南\r\n\r\n欢迎提交 Issue 和 Pull Request。建议贡献前确认：\r\n\r\n1. 功能是否影响 Manifest V3 权限\r\n2. 是否会增加敏感数据外发风险\r\n3. 是否兼容 Service Worker 随时挂起的生命周期\r\n4. 是否保持无框架、零依赖的轻量设计\r\n5. 导出格式是否与 HAR \u002F JSON 结构兼容\r\n\r\n## 常见问题\r\n\r\n\u003Cdetails>\r\n\u003Csummary>为什么抓包时浏览器顶部有黄色提示条？\u003C\u002Fsummary>\r\n\r\n这是 Chrome 在扩展使用 `chrome.debugger` API 时显示的系统提示，属于浏览器安全机制，扩展无法隐藏。\r\n\r\n\u003C\u002Fdetails>\r\n\r\n\u003Cdetails>\r\n\u003Csummary>为什么不要在抓包期间打开 DevTools？\u003C\u002Fsummary>\r\n\r\nDevTools 和本扩展都可能占用同一个 Tab 的调试通道。对同一页面同时调试可能导致抓包中断或事件丢失。\r\n\r\n\u003C\u002Fdetails>\r\n\r\n\u003Cdetails>\r\n\u003Csummary>能抓到响应体吗？\u003C\u002Fsummary>\r\n\r\n可以。项目在 `Network.loadingFinished` 后调用 `Network.getResponseBody` 获取响应体。过大的响应体会自动截断，避免 IndexedDB 存储压力过大。\r\n\r\n\u003C\u002Fdetails>\r\n\r\n\u003Cdetails>\r\n\u003Csummary>AI 解读会上传哪些数据？\u003C\u002Fsummary>\r\n\r\n会上传当前会话的请求摘要，包括 URL、方法、状态码、耗时、请求\u002F响应头，以及可选的请求体和响应体摘要。默认开启敏感字段脱敏，并默认只发送最近 40 条请求。\r\n\r\n\u003C\u002Fdetails>\r\n\r\n\u003Cdetails>\r\n\u003Csummary>API Key 存在哪里？\u003C\u002Fsummary>\r\n\r\nAI 配置保存在本机浏览器的 `chrome.storage.local`。请勿在不可信环境或共享浏览器配置中保存敏感 API Key。\r\n\r\n\u003C\u002Fdetails>\r\n\r\n\u003Cdetails>\r\n\u003Csummary>支持哪些浏览器？\u003C\u002Fsummary>\r\n\r\n主要支持 Google Chrome 和 Chromium 内核浏览器。大多数支持 Manifest V3 与 `chrome.debugger` API 的浏览器都可尝试加载。\r\n\r\n\u003C\u002Fdetails>\r\n\r\n## 注意事项\r\n\r\n- 响应体超过 500KB 会自动截断，防止存储过大\r\n- AI 解读默认只发送最后 40 条请求，单个 Body 会再次截断\r\n- AI 配置保存在本机浏览器，API Key 请谨慎保存\r\n- 导出数据可能包含 Cookie、Token、用户 ID、业务参数等敏感信息，分享前请脱敏\r\n- 抓包数据保存在 IndexedDB，清理浏览器数据可能导致历史归档丢失\r\n\r\n## 适用场景\r\n\r\n- Web 应用接口调试\r\n- 登录、注册、下单、支付等业务流程分析\r\n- API 逆向分析与协议梳理\r\n- 指纹浏览器中的流量录制\r\n- 自动化测试中的请求归档\r\n- HAR 文件生成和问题复现\r\n- 抓包结果 AI 总结与排查建议生成\r\n\r\n## 项目统计\r\n\r\n### 代码统计\r\n\r\n| 文件 | 行数 | 说明 |\r\n|------|-----:|------|\r\n| `background.js` | 942 | Service Worker、CDP、存储、导出、AI 调用 |\r\n| `popup.js` | 607 | Popup 交互、过滤、下载、AI 配置 |\r\n| `popup.css` | 446 | UI 样式与窄窗按钮换行 |\r\n| `popup.html` | 136 | 页面结构 |\r\n| `manifest.json` | 24 | 扩展清单 |\r\n\r\n> 统计时间：2026-05-12。\r\n\r\n### 版本历史\r\n\r\n| 版本 | 说明 |\r\n|------|------|\r\n| v0.0.2 | 新增单条请求 AI 分析、独立模型列表 URL、模型下拉选择、默认窄窗布局 |\r\n| v0.0.1 | 实时抓包、会话归档、请求详情、HAR \u002F JSON 导出、AI 解读、多模型接入、敏感字段脱敏、状态恢复优化 |\r\n\r\n## 路线图\r\n\r\n### 计划功能\r\n\r\n- [ ] 增加请求重放能力\r\n- [ ] 增加会话重命名和标签管理\r\n- [ ] 增加按域名 \u002F 类型 \u002F 时间范围过滤\r\n- [ ] 增加导入 HAR \u002F JSON 后离线查看\r\n- [ ] 增加敏感字段自定义规则\r\n- [ ] 增加更多 AI 分析模板，如接口文档生成、异常聚类、测试用例生成\r\n\r\n### 优化项\r\n\r\n- [ ] 大响应体分块存储\r\n- [ ] 历史会话分页和搜索\r\n- [ ] 导出前脱敏选项\r\n- [ ] Popup 大数据列表虚拟滚动\r\n- [ ] 更完整的错误提示和恢复流程\r\n\r\n## 技术交流群\r\n\r\n欢迎加入技术交流群，交流 Chrome Extension、CDP 抓包、AI 解读、自动化测试和接口分析相关经验。\r\n\r\n![技术交流群](https:\u002F\u002Fmypicture-1258720957.cos.ap-nanjing.myqcloud.com\u002FObsidian\u002F20260524104420_218_6.jpg)\n\r\n## 作者联系\r\n\r\n- GitHub: [hailaobao2026](https:\u002F\u002Fgithub.com\u002Fhailaobao2026)\r\n- 项目地址: \u003Chttps:\u002F\u002Fgithub.com\u002Fhailaobao2026\u002Fpacket-capture-extension>\r\n- 微信: `laohaibao2025`\r\n- 邮箱: `75271002@qq.com`\r\n\r\n![作者微信](https:\u002F\u002Fmypicture-1258720957.cos.ap-nanjing.myqcloud.com\u002FScreenshot_20260123_095617_com.tencent.mm.jpg)\r\n\r\n## 打赏\r\n\r\n如果这个项目对你有帮助，欢迎请作者喝杯咖啡 ☕\r\n\r\n**微信支付**\r\n\r\n![微信支付](https:\u002F\u002Fmypicture-1258720957.cos.ap-nanjing.myqcloud.com\u002FObsidian\u002Fimage-20250914152855543.png)\r\n\r\n## 更新说明\r\n\r\n### v0.0.2\r\n\r\n- 新增单条请求 AI 分析，支持选中请求后单独解释请求参数、响应字段和异常风险\r\n- 支持单独配置模型列表 URL，解决模型调用网关和模型列表接口不一致的问题\r\n- 模型选择从输入框升级为下拉列表，获取模型后可直接选择，也支持自定义模型名\r\n- 默认 Popup 窗口调整为 460x680，宽度减半、高度保持不变，减少对页面遮挡\r\n- 更新 README 和维护文档，补充最新配置与使用说明\r\n\r\n### v0.0.1\r\n\r\n- 实现基于 `chrome.debugger` 的 CDP 抓包核心\r\n- 支持捕获 URL、Method、Headers、Request Body、Response Body、状态码、耗时和失败信息\r\n- 支持会话归档、实时请求过滤、请求详情查看、HAR 1.2 导出和原始 JSON 导出\r\n- 新增 AI 解读标签页，支持对当前抓包会话生成业务链路、关键接口、异常风险和排查建议\r\n- 支持 OpenAI 兼容接口和 Anthropic Claude 接口\r\n- 支持自定义 Base URL，可接入 NewAPI、OneAPI、自建模型网关\r\n- 新增请求\u002F响应 Body 是否发送开关\r\n- 新增敏感字段脱敏，默认遮蔽 Cookie、Authorization、token、password、session 等字段\r\n- 优化 Service Worker 状态恢复，减少后台挂起后状态丢失问题\r\n\r\n### v0.0.0\r\n\r\n- 实现基于 `chrome.debugger` 的 CDP 抓包核心\r\n- 支持捕获 URL、Method、Headers、Request Body、Response Body、状态码、耗时和失败信息\r\n- 支持会话归档，按次保存抓包记录\r\n- 支持实时请求过滤和请求详情查看\r\n- 支持 HAR 1.2 导出和原始 JSON 导出\r\n- 提供暗色 DevTools 风格 Popup UI\r\n\r\n## License\r\n\r\nSPDX-License-Identifier: MIT\r\n\r\n本项目使用 MIT License。建议在仓库中补充 `LICENSE` 文件以便开源分发。\r\n\r\n## Star History\r\n\r\n如果这个项目对你有帮助，欢迎点一个 Star ⭐\r\n\r\n[![Star History Chart](https:\u002F\u002Fapi.star-history.com\u002Fsvg?repos=hailaobao2026\u002Fpacket-capture-extension&type=Date)](https:\u002F\u002Fwww.star-history.com\u002F#hailaobao2026\u002Fpacket-capture-extension&Date)\r\n","`packet-capture-extension` 是一个基于 Chrome 浏览器插件的抓包工具，利用 Chrome DevTools Protocol (CDP) 捕获完整的 HTTP 请求和响应。其核心功能包括实时抓包、响应体获取、会话归档、请求过滤及多种格式导出（如 HAR 和 JSON），并支持 AI 解读和敏感信息脱敏处理。该扩展无需打开 DevTools 即可工作，特别适合于 Web 调试、接口分析、业务流程归档以及自动化测试等场景使用。此外，项目采用纯 JavaScript 编写，无任何外部依赖，加载即用，极大提升了开发者的调试效率。",2,"2026-06-11 04:03:50","CREATED_QUERY"]