Chrome 144.0 引入开发者工具 MCP 协议，AI 智能体现可直连浏览器进行调试

谷歌在最新发布的 Chrome 144.0 版本中，为开发者工具引入了 模型上下文协议 的支持。这一更新意味着，开发者现在可以开启 MCP 并允许 Claude Code 等 AI智能体 直接连接到 Chrome 浏览器，执行自动化调试任务。

这对开发者来说是个值得关注的消息。以往，在使用 AI 辅助编程时，AI 模型通常只能基于静态代码进行分析和推测。现在，借助 MCP 协议，AI 工具可以直接操控真实的浏览器环境，进行“所见即所得”的调试操作。开发者能够直观地看到 AI 对网页元素的修改效果，而不再是依赖 AI 对源代码样式的凭空想象。

当然，目前谷歌仅仅是开放了开发者工具 MCP 协议的支持通道，初期提供的数据源和功能还比较有限。不过，谷歌官方已经表示，后续会逐步向接入的 AI 工具开放更多开发者工具面板的数据和控制能力。

上图展示了 AI 助手 GEMINI 通过 MCP 协议连接 Chrome DevTools，选中页面元素并为其添加 CSS 样式，使其在视口中居中的完整交互过程。

如何启用该功能？

必要条件：Google Chrome 版本需为 v144.0 或更高。

启用方法：

1. 在 Chrome 地址栏输入 chrome://inspect#remote-debugging 并访问。
2. 在打开的页面中，勾选 “允许远程调试” 复选框。

配置 AI 工具进行连接

完成上述基础设置后，你需要配置你的 AI 开发工具来连接 Chrome。最简单的方法是，将谷歌官方的支持文档页面发送给你的 AI 助手，它能够根据你所用的具体工具（如 Claude、OpenAI 等）生成相应的配置代码片段。

官方配置文档地址：https://developer.chrome.com/blog/chrome-devtools-mcp-debug-your-browser-session?hl=zh-cn

当前支持的核心功能

根据官方文档，当前的 MCP 服务器主要支持以下操作场景：

• 运行 Chrome 浏览器并使用为开发者工具 MCP 服务器特制的用户配置文件进行操作。
• 连接到已开启远程调试端口的、正在运行的 Chrome 浏览器实例。
• 以隔离方式运行多个 Chrome 实例，每个实例都使用临时的用户配置文件，适合并行测试。

这项功能的推出，标志着浏览器调试正在与 AI智能体 的开发工作流深度融合。它为自动化测试、智能样式修复、交互式代码生成等场景打开了新的可能性。如果你想了解更多关于 AI 技术在开发中的应用与实践，可以到 云栈社区 的开发者广场与其他同行交流探讨。