Puppeteer 网页爬虫
将以下提示词粘贴到你的 AI 对话框中:
请根据 https://skillhub.cn/install/skillhub.md,安装 @user_3c6cb52e/puppeteer-scraping-framework-2。
技能介绍
解决的问题
传统 HTTP 客户端适合静态页面,但现代站点常把数据藏在 JS 渲染、异步请求、事件绑定和反爬校验之后。Puppeteer 的价值在于直接驱动真实 Chrome:页面能执行脚本、等待元素出现、复用登录态、截取渲染后的 DOM,也更容易处理由浏览器指纹、前端行为检测触发的拦截。该技能面向这类动态抓取场景,尤其是需要把浏览器自动化包装成可复用爬虫流程时。
工作机制
它基于 Puppeteer 与 stealth 插件,在 headless 或 headful Chrome 中打开目标页面。核心链路包括:
- 用 stealth plugin 降低自动化特征暴露,让页面更接近普通浏览器环境;
- 调用
page.setRequestInterception()拦截请求,可以过滤无关资源、改写 headers、观察接口响应或中止噪声请求; - 通过 automatic CAPTCHA detection 在验证码出现时给出信号,便于后续策略判断;
- 使用 CDP sessions 访问更底层的 Chrome DevTools Protocol,适合需要精细控制浏览器、调试协议行为或扩展自动化能力的场景。
此外,材料里提到它可被包装为基于 Puppeteer 的 MCP server,用于浏览器自动化与调试。这个形态适合把抓取、页面操作和排障步骤交给模型或工具链逐步执行。
适用边界与注意点
它不是“万能采集器”。Chrome 渲染带来真实性和兼容性,也带来内存、启动时间、并发上限和稳定性成本;批量任务需要控制页面生命周期与资源复用。request interception 能减少噪声,但改请求头或拦截策略要尊重目标站点条款。验证码检测只能提示风险,不能替代合规的验证处理。CDP 能力更强,但也更接近底层,接入时应隔离权限并做好日志。若数据源多为简单 API,直接请求可能比浏览器自动化更轻量。
使用场景
- 目标站点数据由前端 JS 异步加载,需要等待页面渲染完成后提取商品列表与价格
- 采集接口数据时要过滤图片、字体等无关请求,只保留 XHR 响应用于入库
- 登录态下的会员页面需要复用会话抓取,遇到验证码页面时要及时感知
- 调试浏览器自动化脚本时,需要通过 CDP 查看网络请求、执行页面脚本并定位报错
适合人员
- 负责采集动态渲染电商页面商品与价格数据、需要处理登录态和验证码的爬虫工程师
- 用浏览器自动化做端到端数据校验、需要排查前端脚本与网络请求问题的测试工程师
- 搭建 MCP 工具链、希望把网页抓取与页面调试包装成模型可调用步骤的 AI 应用开发者