前言¶
网页接口排查的一个常见痛点是：页面功能正常，但拿不到它实际发出的请求。手动开开发者工具逐条看，响应体长、参数多，复制出来容易漏；换一台机器又得重来一遍。更麻烦的是登录态、动态参数这类只在浏览器上下文里存在的东西，用命令行工具重新发请求往往不成立。
下面介绍的「数据抓包代码」，就是把 Playwright 的浏览器自动化能力封装成一个可调用的 Skill：在真实页面环境里拦截 XHR 与 Fetch，导出结构化报告。
这是什么¶
「数据抓包代码」是一个社区来源的 Agent Skill，坐标 @user_7e77ad98/capure，由 user_7e77ad98 发布维护，版本 1.0.0。它的目标不是做通用的网络层抓包，而是针对浏览器内的接口请求：在页面真实运行过程中捕获 XHR 与 Fetch 的请求和响应，并可以按需生成 HAR 或 CSV 报告。
核心功能¶
已核实的能力如下：
- 使用 Python + Playwright 做浏览器自动化，在页面上下文里运行，因此携带的是浏览器真实的 Cookie、LocalStorage 和登录态。
- 捕获页面发出的 XHR 与 Fetch 请求及响应，包含 URL、请求方法、请求头、请求体、响应状态与响应体。
- 支持对浏览器请求做 Mock 或修改，便于前端调试时构造特定响应。
- 生成 HAR 或 CSV 格式的报告，方便后续分析或存档。
- 标签 requires_api_key=false，使用前不需要申请额外的 API Key。
安装与启用¶
官方地址是 https://api.skillhub.cn/user_7e77ad98/capure ，SkillHub 页面为 https://www.skillhub.cn/skills/user_7e77ad98/capure 。在 SkillHub 页面按站内流程添加到 Agent 配置即可。
运行环境需要自备 Python 与 Playwright：
pip install playwright
playwright install chromium
代码块外说明：第一条安装 Python 依赖，第二条下载 Playwright 所需的 Chromium 浏览器内核。已抓取资料中未给出具体的安装命令、目录约定或配置文件字段，此处不臆测；接入时以官方页面说明为准。
该 Skill 采用通用 SKILL.md 格式。资料中未区分 Cursor、Codex CLI、Claude Code 的接入差异，本文不做分别说明。
典型用法¶
已抓取资料给出的适用场景集中在需求表达层面，以下是可直接对 Agent 提出的任务描述：
- 抓某个网站的接口：说明目标网址，由 Skill 驱动浏览器访问并捕获接口请求。
- 看某个页面请求了哪些 API：用于梳理页面行为，输出请求清单。
- 抓包分析：拿到请求与响应后做归类和解读。
- 逆向某个 App 的 H5 页面接口：前提是页面运行在浏览器中，可走同样的捕获流程。
- 生成 HAR 文件：把捕获结果导出为 HAR，便于在 DevTools 或第三方工具中回放分析。
- Mock 接口响应：修改或替换页面实际收到的响应，验证前端分支逻辑。
触发条件来自官方简介：当需要抓取网页接口、分析 API 请求、逆向前端接口、采集动态加载的数据、Mock 或修改浏览器请求、生成 HAR 或 CSV 报告时使用此技能。采集动态加载的数据依赖接口响应本身，不是独立的功能项。
适用场景与注意¶
适合的场景：网页接口逆向、前端接口调试、动态加载数据的采集、需要 HAR 或 CSV 存档的接口分析。
不适用的场景，资料中明确给出两条边界：
- 抓 TCP/UDP 网络层原始包：应使用 Wireshark 或 scapy。本 Skill 只工作在浏览器与页面层面，看不到网络层包。
- 抓移动原生 App 的流量：应使用 mitmproxy 加 frida。原生 App 不经过浏览器，Playwright 无法接入。
另外需要注意：捕获范围限于浏览器发出的 XHR 与 Fetch。页面通过 WebSocket 或其他通道传输的数据不在本 Skill 的描述范围内；遇到这类需求应先确认资料是否支持，不要默认可以抓到。
结尾¶
「数据抓包代码」的价值在于把抓包这件事放进了自动化流程：浏览器自动打开页面、拦截请求、输出报告，省去手工在开发者工具里逐条复制的步骤，并且保留了真实的登录态上下文。它的边界也很清楚，只覆盖浏览器内的 XHR 与 Fetch。
官方地址：https://api.skillhub.cn/user_7e77ad98/capure
