关键词

网页抓取数据采集浏览器自动化Puppeteer微服务

使用说明

项目简介

本项目是HCD（Housing and Community Development）仪表盘的后端微服务组件，它基于Node.js和Puppeteer构建，旨在为仪表盘提供网页数据抓取和网页截图的功能。该服务可以被视为一个Model Context Protocol (MCP) 服务器的特定实现，其核心职责是提供“工具”——即网页浏览器自动化能力——供仪表盘客户端调用，以收集和处理住房相关数据。

主要功能点

  • 网页抓取 (Scraping)：提供API接口，允许客户端指定URL、CSS选择器等参数，抓取目标网页的HTML内容和特定元素的数据。
  • 网页截图 (Screenshot)：提供API接口，允许客户端截取整个网页或特定元素的截图，用于数据可视化或存档。
  • 灵活的抓取配置：支持设置等待选择器、点击选择器、提取选择器、超时时间、用户代理、自定义请求头等高级抓取选项。
  • 浏览器实例池：内置浏览器实例池管理，优化资源利用率和并发性能。
  • 状态监控：提供API接口，用于监控服务器的运行状态、浏览器实例池状态和内存使用情况。
  • CORS支持：已配置CORS，允许跨域请求，方便仪表盘客户端调用。

安装步骤

  1. 克隆仓库

    git clone https://github.com/bbuxton0823/HCD-Dashboard.git
cd HCD-Dashboard

  2. 安装依赖

    npm install
# 或者
yarn

  3. 配置环境变量

    • 复制 '.env.local.example' 文件并重命名为 '.env.local'。
    • 确保 '.env.local' 文件中 'PUPPETEER_EXECUTABLE_PATH' 环境变量配置了Puppeteer可执行文件的路径。如果未配置，Puppeteer将尝试自动下载Chromium。

  4. 启动服务器 打开终端，进入 'HCD-Dashboard' 仓库目录，运行以下命令启动 Puppeteer MCP 服务器：

    npm run puppeteer-mcp
# 或者
yarn puppeteer-mcp

    服务器默认监听端口为 '3600'，可以通过修改 'puppeteer-mcp-server.js' 文件中的 'PORT' 变量进行更改。

服务器配置

MCP客户端需要配置以下信息以连接到 Puppeteer MCP 服务器：

{
  "serverName": "Puppeteer MCP Server",
  "command": "npm",
  "args": ["run", "puppeteer-mcp"]
}

配置参数注释：

  • 'serverName': 服务器名称，可自定义，用于在客户端标识服务器。
  • 'command': 启动服务器的命令，这里使用 'npm'。
  • 'args': 启动命令的参数，这里使用 '["run", "puppeteer-mcp"]'，对应 'package.json' 中定义的 'puppeteer-mcp' 脚本。

基本使用方法

Puppeteer MCP 服务器提供以下API接口：

  • 'POST /api/scrape': 网页抓取接口。客户端需要POST JSON格式的请求体，包含以下参数：

    • 'url' (string, 必选): 目标网页URL。
    • 'waitForSelector' (string, 可选): CSS选择器，服务器将等待该元素出现后才开始抓取。
    • 'clickSelector' (string, 可选): CSS选择器，服务器将点击该元素。
    • 'extractSelectors' (object, 可选): 一个键值对对象，键为自定义数据字段名，值为CSS选择器，用于提取网页中特定元素的数据。
    • 'timeout' (number, 可选): 超时时间，单位毫秒，默认30000毫秒。
    • 'waitForNetworkIdle' (boolean, 可选): 是否等待网络空闲，默认为 'false'。
    • 'userAgent' (string, 可选): 自定义User-Agent。
    • 'headers' (object, 可选): 自定义请求头。
    • 'screenshotSelector' (string, 可选): CSS选择器，用于截取特定元素的截图。

    服务器返回JSON格式的响应，包含抓取的HTML内容、提取的数据和截图（如果请求）。

  • 'POST /api/screenshot': 网页截图接口。客户端需要POST JSON格式的请求体，包含以下参数：

    • 'url' (string, 必选): 目标网页URL。
    • 'selector' (string, 可选): CSS选择器，用于截取特定元素的截图。如果为空，则截取整个页面。
    • 'fullPage' (boolean, 可选): 是否截取完整页面，默认为 'false'。
    • 'timeout' (number, 可选): 超时时间，单位毫秒，默认30000毫秒。

    服务器返回JSON格式的响应，包含Base64编码的PNG截图。

  • 'GET /api/status': 服务器状态接口。客户端可以通过GET请求该接口获取服务器的运行状态、浏览器实例池信息等。

注意： 此MCP服务器主要服务于HCD仪表盘应用，客户端通常是仪表盘的前端或后端服务，通过HTTP请求调用上述API接口来使用网页抓取和截图功能。

信息

分类

网页与API

访问项目