Puppeteer MCP服务器

你是否曾经希望自己的AI助手能够像真人一样操作浏览器：点击按钮、填写表单、执行JavaScript，甚至捕获控制台日志？今天要介绍的开源项目Puppeteer MCP服务器，正是为了实现这个目标而设计的。它是一个基于Puppeteer的MCP服务器，让大型语言模型能够通过简单的工具调用，完成复杂的浏览器自动化任务。

项目基本信息

一、项目介绍

Puppeteer MCP服务器是模型上下文协议官方提供的服务器之一，它封装了Puppeteer这个强大的浏览器自动化库。通过这个服务器，AI助手可以获得以下能力：

• 导航到任意URL
• 截取网页截图（全页面或特定元素）
• 点击、悬停、填写表单、下拉选择
• 在浏览器控制台中执行JavaScript
• 访问浏览器控制台日志
• 管理截图资源

这个服务器特别适合需要与网页进行复杂交互的场景。与普通的HTTP请求不同，Puppeteer驱动真实的浏览器环境，因此可以完美处理JavaScript渲染的单页应用、执行页面上的脚本，并捕获真实的控制台输出。

二、核心优势

官方出品，稳定可靠

这是MCP官方团队维护的服务器，代码质量有保证，会跟随MCP协议版本同步更新。

功能全面

提供了7个浏览器自动化工具，覆盖了网页交互的主要场景：

• 导航
• 截图
• 点击
• 悬停
• 填写表单
• 下拉选择
• 执行JavaScript

资源访问

除了工具调用，服务器还提供两种资源的访问：

• 控制台日志：以文本格式访问浏览器中的所有控制台输出
• 屏幕截图：通过名称访问捕获的PNG图像

多种部署方式

支持Docker和NPX两种运行方式，适应不同的使用环境：

• Docker方式：使用无头Chromium，适合服务器部署
• NPX方式：会打开可见的浏览器窗口，适合本地调试

官方文档完善

作为官方项目，文档详细，社区支持好，遇到问题容易找到解决方案。

三、适用场景

开发者学习和参考

对于想学习浏览器自动化或MCP服务器开发的开发者，这是一个很好的学习范例。它展示了如何将Puppeteer封装成标准的MCP工具。

网页自动化测试

可以用它来构建自动化测试脚本。例如，让AI自动登录系统、填写表单、验证页面元素，并捕获测试过程中的截图和控制台日志。

数据抓取

对于需要JavaScript渲染的动态网站，传统的HTTP请求无法获取完整内容。通过这个服务器，AI可以驱动真实浏览器，执行页面脚本，获取渲染后的内容。

日常工作和效率提升

与Claude Desktop等客户端结合后，你可以用自然语言指挥AI完成浏览器操作：

• “帮我打开这个网站并截取首页截图”
• “点击页面上的‘登录’按钮，然后填写用户名和密码”
• “在控制台执行这段JavaScript，并返回结果”

四、安装教程

系统要求

安装步骤

Puppeteer MCP服务器的安装非常简单，不需要克隆代码仓库，直接通过NPX或Docker即可运行。

方式一：NPX安装（推荐用于本地开发）

这种方式会在你的机器上直接运行Puppeteer，并且会打开可见的浏览器窗口，便于观察自动化过程。

第一步：配置Claude Desktop

找到Claude Desktop的配置文件：

• macOS: ~/Library/Application Support/Claude/claude_desktop_config.json
• Windows: %APPDATA%\Claude\claude_desktop_config.json

添加以下配置：

{
  "mcpServers": {
    "puppeteer": {
      "command": "npx",
      "args": ["-y", "@modelcontextprotocol/server-puppeteer"]
    }
  }
}

第二步：重启Claude Desktop

保存配置文件后，完全退出并重启Claude Desktop。服务器会自动下载并启动。

方式二：Docker安装（推荐用于服务器部署）

这种方式在Docker容器中运行，使用无头Chromium，适合生产环境或远程服务器。

在Claude Desktop配置文件中添加：

{
  "mcpServers": {
    "puppeteer": {
      "command": "docker",
      "args": ["run", "-i", "--rm", "--init", "-e", "DOCKER_CONTAINER=true", "mcp/puppeteer"]
    }
  }
}

注意：首次运行时会自动拉取Docker镜像，可能需要一些时间。

验证安装

配置完成后，在Claude Desktop中尝试输入：“使用puppeteer导航到https://example.com”。如果服务器正常工作，Claude会调用puppeteer_navigate工具，并返回导航结果。

五、使用示例

配置完成后，你就可以在MCP客户端中使用自然语言来调用各种浏览器自动化工具了。

示例1：导航到网页

用户指令：“使用puppeteer打开https://github.com”

AI会调用puppeteer_navigate工具，参数为{"url": "https://github.com"}。

示例2：截图

用户指令：“截取当前页面的全屏截图，命名为homepage”

AI会调用puppeteer_screenshot工具：

{
  "name": "homepage",
  "width": 1200,
  "height": 800
}

截图会保存为资源，可以通过screenshot://homepage访问。

截取特定元素：“只截取页面上class为‘header’的区域”

{
  "name": "header_only",
  "selector": ".header"
}

示例3：点击和填写表单

假设你想让AI自动登录一个网站：

用户指令：

1. “导航到https://example.com/login”
2. “在#username输入框中填写‘myuser’”
3. “在#password输入框中填写‘mypass’”
4. “点击#submit按钮”

AI会依次调用：

• puppeteer_navigate
• puppeteer_fill (selector="#username", value="myuser")
• puppeteer_fill (selector="#password", value="mypass")
• puppeteer_click (selector="#submit")

示例4：执行JavaScript

用户指令：“在控制台执行document.title，并返回结果”

AI会调用puppeteer_evaluate工具：

{
  "script": "document.title"
}

返回值为当前页面的标题。

示例5：获取控制台日志

用户指令：“显示当前浏览器控制台的所有日志”

AI会访问console://logs资源，获取所有控制台输出，包括console.log、console.error等。

示例6：复杂交互流程

以下是一个完整的自动化测试流程示例，你可以用自然语言告诉AI：

“请执行以下操作：

1. 打开https://www.saucedemo.com
2. 在用户名框输入standard_user
3. 在密码框输入secret_sauce
4. 点击登录按钮
5. 等待页面跳转后，截取整个页面截图，命名为inventory_page
6. 点击第一个商品的‘添加到购物车’按钮
7. 点击购物车图标
8. 截取购物车页面截图，命名为cart_page
9. 执行JavaScript获取购物车中的商品数量”

AI会按顺序调用相应的工具，完成整个流程。

六、常见问题

问题1：NPX方式运行时，浏览器没有打开

解决方案：NPX方式默认会打开可见的浏览器窗口。如果没有打开，请检查：

• 你的系统是否安装了Chromium或Chrome
• 是否有其他进程占用了调试端口
• 在配置中添加"env": {"PUPPETEER_HEADLESS": "false"}强制显示窗口

问题2：Docker方式运行时，提示“Cannot connect to the Docker daemon”

解决方案：请确保Docker守护进程正在运行。在macOS或Windows上，启动Docker Desktop应用。在Linux上，运行sudo systemctl start docker。

问题3：截图保存后如何查看？

解决方案：截图以资源形式存储，可以通过screenshot://<name>访问。在Claude Desktop中，你可以直接说“显示我刚刚截取的homepage截图”，Claude会展示图片。

问题4：执行JavaScript时，脚本运行时间过长

解决方案：某些脚本可能需要较长时间。目前服务器没有设置严格的超时限制，但如果你遇到问题，可以尝试将脚本拆分为多个小的evaluate调用。

问题5：能否同时打开多个标签页或浏览器实例？

解决方案：当前版本的服务器似乎管理的是单个浏览器页面。如果需要多标签页，你可能需要查看官方文档是否有更新，或者考虑使用其他支持多标签页的浏览器MCP服务器。

七、总结

Puppeteer MCP服务器是MCP官方生态中的重要一员。它干净、专注、稳定，提供了浏览器自动化所需的核心功能。与其他第三方浏览器MCP相比，它的优势在于：

• 官方维护：与MCP协议同步更新，兼容性有保障
• 功能聚焦：不做过多的抽象，直接暴露Puppeteer的核心能力
• 双部署模式：NPX适合本地开发，Docker适合服务器部署

如果你需要一个稳定、可靠、由官方维护的浏览器自动化MCP服务器，Puppeteer MCP服务器是最直接的选择。 无论是用于自动化测试、数据抓取，还是构建AI驱动的网页交互应用，它都能提供坚实的基础。

对于想要更高级功能（如多标签页管理、请求拦截、隐身模式）的用户，可以关注社区中的其他浏览器MCP项目，但如果你追求稳定和简洁，官方Puppeteer服务器绝对不会让你失望。