M
MCP 精选目录 CURATED DIRECTORY
已收录 911 个 MCP Server
EN
← 返回目录
C

Chrome DevTools MCP

官方
Chrome 团队官方 MCP Server，让 AI 助手直接调用 Chrome DevTools 能力
查看安装方法 ↓ 横向对比 GitHub 源仓库 ↗
分类
浏览器自动化 第 2 / 32
Stars
★ 53.8k 非常热门
传输方式
stdio（本地进程）
运行环境
Node.js LTS · 预编译二进制 Chrome stable
凭据
无需凭据
许可证
Apache-2.0
最近提交
工具数
22
76FMRS · B

Chrome DevTools 官方团队维护，工具按输入自动化、导航、仿真、性能、网络分类，覆盖面广且有专门的 troubleshooting 文档。npx 一行命令即可启动。评分基于源码与文档静态核验，未实际运行验证。

最强项 · 安装易用性 17/20 最弱项 · 安全与权限 12/20

可靠性
13/20
安全与权限
12/20
维护活跃度
17/20
文档质量
17/20
安装易用性
17/20

实测已过期收录于 2026-07-24

查看 FMRS 评分方法 →

选型与风险

能访问什么访问网络控制浏览器

适合谁

  • 前端开发者需要 AI 辅助进行网页调试和性能分析的场景
  • 需要将浏览器自动化操作和性能诊断结合在同一工具里的场景

不适合谁

  • 只需要抓取网页文本内容而不涉及性能分析或复杂交互的场景（用更轻量的抓取工具即可）

所需权限

  • 需要在本地运行 Chrome 浏览器实例
  • navigate_page 可访问任意 URL，type_text/fill_form 等工具可在页面中输入任意内容

风险与副作用

  • 浏览器自动化工具可以访问和操作打开的页面内容，建议只在受信任的开发/测试环境中使用
  • performance_start_trace 等性能追踪功能会持续记录浏览器活动，注意不要在包含敏感信息的页面上长时间开启

安装接入

准备工作

运行环境：Node.js LTS · 预编译二进制 Chrome stable

其他可选配置项（5 个）
CHROME_DEVTOOLS_MCP_NO_USAGE_STATISTICS 可选 设置后禁用 Google 使用统计收集；也可用 --no-usage-statistics 标志。
CI 可选 设置后自动禁用使用统计收集。
CHROME_DEVTOOLS_MCP_NO_UPDATE_CHECKS 可选 设置后禁用 npm 更新检查通知。
DEBUG 可选 设为 * 可启用详细调试日志，用于提交问题报告。
PROGRAMFILES 可选 Windows 11 上 Codex CLI 配置所需，指向 Chrome 安装目录 C:\\Program Files。

通过 npx -y chrome-devtools-mcp@latest 启动即可，@latest 确保始终使用最新版本。如果只需要基础浏览器操作，可加 --slim 参数进入精简模式，减少启用的工具数量。

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

以 Claude Code 为例。其他客户端的配置文件位置或字段可能不同（如 VS Code 使用 servers 字段），可用下方配置生成器转换。

.vscode/mcp.json
{
  "servers": {
    "chrome-devtools": {
      "command": "npx",
      "args": [
        "-y",
        "chrome-devtools-mcp@latest"
      ]
    }
  }
}

写入项目的 .vscode/mcp.json（VS Code 使用 servers 字段）。

Terminal
claude mcp add chrome-devtools -- npx -y chrome-devtools-mcp@latest

在终端运行；先把 <…> 占位符换成你自己的值。

生成并校验客户端配置

验证是否装好

在 MCP 客户端中添加配置后，确认工具列表出现 click、navigate_page、take_screenshot 等工具，然后输入提示 "Check the performance of https://developers.chrome.com"，客户端应打开浏览器并录制性能轨迹。

常见排障

  1. 工具未响应：确认 Chrome 是否已正确启动并且 MCP 客户端有权限连接
  2. 性能追踪结果异常：确保追踪期间没有其他程序抢占系统资源导致数据失真
  3. 元素操作失败：查看 docs/troubleshooting.md 中列出的常见问题

试试这样问

连接成功后，可以直接对 AI 助手这样说：

  • 检查 https://developers.chrome.com 的性能
  • 打开 https://example.com 并截图
  • 列出当前打开的所有页面
  • 填写登录表单并点击提交按钮

工具能力 22

click 写入
点击页面元素
drag 写入
拖拽页面元素
fill 写入
填写单个输入框
fill_form 写入
批量填写表单
handle_dialog 写入
处理浏览器弹窗（alert/confirm/prompt）
hover 只读
悬停在页面元素上
press_key 写入
模拟按键操作
type_text 写入
输入文本
展开其余 14 个工具
upload_file 写入
上传文件
click_at 写入
在指定坐标点击
close_page 写入
关闭页面
list_pages 只读
列出当前打开的所有页面
navigate_page 写入
导航页面到指定 URL
new_page 写入
打开新页面
select_page 只读
切换到指定页面
wait_for 只读
等待指定条件满足
emulate 写入
模拟设备/网络环境
resize_page 写入
调整页面视口大小
performance_analyze_insight 只读
分析性能追踪中的具体洞察项
performance_start_trace 写入
开始性能追踪录制
performance_stop_trace 只读
停止性能追踪并返回结果
get_network_request 只读
获取指定网络请求的详细信息

使用场景

用 AI 助手分析网页性能追踪，定位加载缓慢的具体环节
自动化填写表单、点击按钮完成网页操作
检查特定网络请求的响应内容和耗时
模拟不同设备和网络环境测试页面适配

支持客户端

Claude Code
VS Code
Cursor
Windsurf
JetBrains IDEs
Cline
Amp
Kiro
Antigravity

依据项目文档列出，未经本站实测。

详细介绍

Google Chrome DevTools 团队官方维护的 MCP Server，把浏览器输入自动化、导航控制、页面仿真、性能追踪分析和网络请求检查等 Chrome DevTools 能力暴露给 AI 编码助手，用于调试网页问题、分析性能瓶颈和自动化浏览器操作。

同类可选方案

与其他 MCP 横向对比

源版本 ff5204aaf572 数据同步于 2026-10-19 查看 FMRS 评分方法