ChromeDevTools/chrome-devtools-mcp

用于代理的 Chrome DevTools (chrome-devtools-mcp)

是什么 – 一个基于 Node 的服务器，通过 Model‑Context‑Protocol (MCP) 暴露 Chrome DevTools 功能。它允许 AI 编码助手（Claude、Copilot、Cursor、Antigravity 等）操控真实的 Chrome 浏览器：检查页面、记录性能追踪、调试网络流量、截取屏幕截图，并使用 Puppeteer 执行自动化操作。

为何重要 – 现代 AI 代理擅长生成代码，但仍需要一种可靠的方式来与实时浏览器交互。通过使用 MCP，代理可以请求工具“打开此 URL 并给我一份性能报告”或“点击此按钮并返回控制台输出”，而无需编写自定义的 Selenium 脚本。服务器负责处理繁重任务（启动 Chrome、等待结果、将 DevTools 数据转换为 JSON），使代理能够专注于更高层次的推理。

核心功能

• 性能洞察 – 记录 Chrome 追踪数据，提取指标，并（可选）通过 CrUX API 补充真实用户数据。
• 调试工具 – 访问网络日志、控制台消息（带源映射堆栈跟踪）和截图。
• 可靠自动化 – 封装 Puppeteer，自动执行点击、导航、表单填写等操作，并自动等待页面稳定。
• MCP 接口 – 通过标准的 JSON over WebSocket 协议暴露上述所有功能，AI 代理可将其作为工具调用。
• CLI 模式 – 一个独立的命令行工具（npx chrome-devtools-mcp），无需 MCP 客户端即可即用。

快速上手

1. 安装 Node LTS 和最新稳定版 Chrome。
2. 将服务器添加到代理的 MCP 配置中，例如：

   {
     "mcpServers": {
       "chrome-devtools": {
         "command": "npx",
         "args": ["-y", "chrome-devtools-mcp@latest"]
       }
     }
   }
   

3. 在代理的提示中请求任务，例如 Check the performance of https://developers.chrome.com。服务器将启动 Chrome，记录追踪数据，并返回分析结果。
4. 轻量使用时，使用 --slim --headless 启动服务器。

配置与高级用法 – 使用标志控制无头模式、隔离用户数据目录、并发会话、连接现有 Chrome 实例或 Android 调试。完整列表请参阅链接文档。

隐私与数据 – 默认情况下，该工具会发送匿名使用统计信息，并可能查询 CrUX API 以获取现场性能数据。可通过 --no-usage-statistics 或环境变量 CHROME_DEVTOOLS_MCP_NO_USAGE_STATISTICS / CI 禁用。

典型用户 – 需要浏览网页、分析页面速度或调试前端代码的 AI 驱动的编码助手、IDE 扩展或自主代理的开发者。

---

所有细节均直接取自仓库的 README。