关键词

浏览器自动化Puppeteer网页抓取网页分析截图工具

项目简介

MCP Master Puppeteer是一个高级的Model Context Protocol (MCP) 服务器，专门用于通过Puppeteer库实现浏览器自动化。它旨在以标准化的方式，为大型语言模型（LLM）客户端提供访问浏览器功能的能力。该项目高度优化了响应数据，以最小化LLM的Token使用量，同时在需要时提供全面的网页信息，包括导航、内容提取、截图、表单分析以及详细的页面信息（SEO、可访问性、性能等）。

主要功能点

  • 网页导航与分析: 访问指定URL，获取页面状态、标题，并可选择性地提取内容（Markdown、HTML、纯文本或结构化JSON）、元数据和性能指标。
  • 智能内容提取: 从网页中提取结构化内容，支持多种输出格式（Markdown、HTML、纯文本、结构化JSON），并可选择包含页面结构分析。
  • LLM优化截图: 拍摄网页或特定元素的截图，自动调整图像尺寸以符合LLM的输入限制，支持多种图像格式和自定义尺寸策略。
  • 全面页面信息: 获取详尽的页面元数据、SEO评估、可访问性指标和性能数据。
  • 表单深度分析: 自动识别和分析页面上的所有表单，提供详细的字段信息和可能的表单用途。
  • 批量交互操作: 顺序执行点击、输入、选择、悬停、等待、滚动等多种页面交互动作，并提供详细结果和导航控制。
  • Token高效设计: 响应数据经过精心优化，默认只返回关键信息，通过选项按需获取更多数据，显著降低LLM的Token消耗。

安装步骤

  1. 确保您的系统已安装Node.js (推荐LTS版本) 和 npm。
  2. 打开命令行终端，执行以下命令安装MCP Master Puppeteer： 
    npm install mcp-master-puppeteer
  3. 安装完成后，您可以通过运行以下命令直接启动服务器： 
    npx mcp-master-puppeteer
    或者，如果您想在您的MCP客户端中使用它，请参照下面的配置说明。

服务器配置

MCP客户端需要配置MCP Master Puppeteer服务器的启动信息，以便客户端能够连接并调用其提供的工具。以下是一个MCP客户端（例如Anthropic Claude客户端）配置 'mcp-master-puppeteer' 服务器的示例：

{
  "mcpServers": {
    "puppeteer": {
      "command": "mcp-master-puppeteer",
      "args": [],
      "env": {
        "PUPPETEER_HEADLESS": "false",
        "PUPPETEER_ARGS": "{\"headless\": false}"
      }
    }
  }
}
  • 'mcpServers.puppeteer.command': 这个字段指定了启动MCP Master Puppeteer服务器的命令，通常是 'mcp-master-puppeteer'。
  • 'mcpServers.puppeteer.args': 这是一个可选的参数数组，用于向服务器的启动命令传递额外的命令行参数。
  • 'mcpServers.puppeteer.env': 这是一个可选的环境变量配置对象。
    • 'PUPPETEER_HEADLESS': 设置为 '"false"' 可以让Puppeteer在有头模式下运行，这意味着您会看到一个真实的浏览器窗口弹出并执行操作，这在调试时非常有用。默认情况下，Puppeteer是无头模式（不显示浏览器界面）运行的。
    • 'PUPPETEER_ARGS': 这是一个JSON字符串，用于传递更复杂的Puppeteer启动选项。例如，'"{"headless": false}"' 等同于 'PUPPETEER_HEADLESS: "false"'，可以用于配置更多Puppeteer的启动行为，比如设置代理、禁用某些功能等。

基本使用方法

一旦MCP Master Puppeteer服务器在MCP客户端中配置并成功启动，LLM客户端就可以通过调用服务器提供的工具来执行浏览器自动化任务。

例如，LLM客户端可以通过发送以下JSON请求来调用 'puppeteer_navigate_analyze' 工具，以导航到一个网页并获取其标题和状态码：

{
  "name": "puppeteer_navigate_analyze",
  "arguments": {
    "url": "https://example.com"
  }
}

如果LLM客户端需要获取页面的Markdown内容和基本元数据，可以这样调用：

{
  "name": "puppeteer_navigate_analyze",
  "arguments": {
    "url": "https://example.com",
    "contentFormat": "markdown",
    "includeMetadata": true
  }
}

要调用 'puppeteer_screenshot_plus' 工具来捕获多个视口尺寸的网页截图：

{
  "name": "puppeteer_screenshot_plus",
  "arguments": {
    "name": "homepage",
    "breakpoints": [375, 768, 1280],
    "format": "jpeg"
  }
}

服务器将返回JSON格式的结果，其中可能包含截图的Base64编码数据以及其他相关信息。LLM可以解析这些结果，根据获取到的信息进行后续的思考、决策或与其他工具的组合使用。

信息

分类

网页与API

访问项目