ChromeDevTools chrome-devtools-mcp

Chrome DevTools for agents（chrome-devtools-mcp）让你的编码代理（如 Antigravity、Claude、Cursor 或 Copilot）能够控制和检查一个实时的 Chrome 浏览器。它作为一个模型-上下文-协议（MCP）服务器，为你的 AI 编码助手提供完整的 Chrome DevTools 功能，用于可靠的自动化、深入的调试和性能分析。同时还提供了一个 CLI，可在不使用 MCP 的情况下使用。工具参考 | 更新日志 | 贡献指南 | 故障排除 | 设计原则

主要功能

获取性能洞察：使用 Chrome DevTools 记录跟踪并提取可操作的性能洞察。
高级浏览器调试：分析网络请求、截取屏幕截图并检查浏览器控制台消息（附带源映射堆栈跟踪）。
可靠自动化：使用 Puppeteer 在 Chrome 中自动化操作，并自动等待操作结果。

免责声明

chrome-devtools-mcp 会将浏览器实例的内容暴露给 MCP 客户端，允许它们检查、调试和修改浏览器或 DevTools 中的任何数据。请避免共享你不希望与 MCP 客户端共享的敏感或个人信息。

chrome-devtools-mcp 仅官方支持 Google Chrome 和 Chrome for Testing。其他基于 Chromium 的浏览器可能也能工作，但不保证，并且你可能会遇到意外行为。请自行承担使用风险。

我们致力于为最新版本的 Extended Stable Chrome 提供修复和支持。

性能工具可能会将跟踪 URL 发送到 Google CrUX API 以获取真实用户体验数据。这有助于通过将现场数据与实验室数据一起呈现，提供全面的性能视图。这些数据由 Chrome 用户体验报告（CrUX）收集。要禁用此功能，请使用 --no-performance-crux 标志运行。

使用统计

Google 会收集使用统计数据（例如工具调用成功率、延迟和环境信息），以改进 Chrome DevTools MCP 的可靠性和性能。数据收集默认启用。你可以通过在启动服务器时传递 --no-usage-statistics 标志来选择退出：

"args": ["-y", "chrome-devtools-mcp@latest", "--no-usage-statistics"]

Google 将根据 Google 隐私政策处理这些数据。Google 对 Chrome DevTools MCP 使用统计数据的收集与 Chrome 浏览器的使用统计数据无关。选择退出 Chrome 指标不会自动使你退出此工具，反之亦然。如果设置了 CHROME_DEVTOOLS_MCP_NO_USAGE_STATISTICS 或 CI 环境变量，则数据收集将被禁用。

更新检查

默认情况下，服务器会定期检查 npm 注册表以获取更新，并在有新版本可用时记录通知。你可以通过设置 CHROME_DEVTOOLS_MCP_NO_UPDATE_CHECKS 环境变量来禁用这些更新检查。

要求

Node.js LTS 版本
Chrome 当前稳定版或更新版本
npm

快速开始

将以下配置添加到你的 MCP 客户端：

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

注意：使用 chrome-devtools-mcp@latest 可确保你的 MCP 客户端始终使用最新版本的 Chrome DevTools MCP 服务器。

如果你只对执行基本的浏览器任务感兴趣，请使用 --slim 模式：

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

请参阅 Slim 工具参考。

MCP 客户端配置

Amp

请访问 https://ampcode.com/manual#mcp 并使用上述配置。你也可以使用 CLI 安装 Chrome DevTools MCP 服务器：

amp mcp add chrome-devtools -- npx chrome-devtools-mcp@latest

Antigravity

要使用 Chrome DevTools MCP 服务器，请按照 Antigravity 文档中的说明安装自定义 MCP 服务器。将以下配置添加到 MCP 服务器配置中：

{  
  "mcpServers": {  
    "chrome-devtools": {  
      "command": "npx",  
      "args": ["chrome-devtools-mcp@latest", "--browser-url=http://127.0.0.1:9222", "-y"]  
    }  
  }  
}

这将使 Chrome DevTools MCP 服务器自动连接到 Antigravity 正在使用的浏览器。如果你未使用端口 9222，请确保相应调整。使用此方法时，Chrome DevTools MCP 不会自动启动浏览器实例，因为它会连接到 Antigravity 的内置浏览器。如果浏览器尚未运行，你需要先点击右上角的 Chrome 图标启动它。

Claude Code

通过 CLI 安装（仅 MCP） 使用 Claude Code CLI 添加 Chrome DevTools MCP 服务器（指南）：

claude mcp add chrome-devtools --scope user npx chrome-devtools-mcp@latest

作为插件安装（MCP + 技能） [!NOTE] 如果你之前已为 Claude Code 安装过 Chrome DevTools MCP，请确保先从安装和配置文件中移除它。

要安装带有技能的 Chrome DevTools MCP，请在 Claude Code 中添加市场注册表：

/plugin marketplace add ChromeDevTools/chrome-devtools-mcp

然后安装插件：

/plugin install chrome-devtools-mcp@chrome-devtools-plugins

重启 Claude Code 以加载 MCP 服务器和技能（使用 /skills 检查）。

[!TIP] 如果插件安装失败并出现 Failed to clone repository 错误（例如，企业防火墙后的 HTTPS 连接问题），请参阅故障排除指南以获取解决方法，或改用上述 CLI 安装方法。

Cline

请访问 https://docs.cline.bot/mcp/configuring-mcp-servers 并使用上述配置。

Codex

按照配置 MCP 指南，使用上述标准配置。你也可以使用 Codex CLI 安装 Chrome DevTools MCP 服务器：

codex mcp add chrome-devtools -- npx chrome-devtools-mcp@latest

在 Windows 11 上 通过更新 .codex/config.toml 并添加以下 env 和 startup_timeout_ms 参数来配置 Chrome 安装位置并增加启动超时时间：