🐾 claw-stack
插件 OpenClaw 生态

Browser Control

为 AI Agent 提供完整的 Chrome DevTools 访问——自动化、调试和分析任何在线页面

概览

Browser Control 通过模型上下文协议将 AI Agent 与实时 Chrome 实例连接起来。基于 Chrome DevTools 和 Puppeteer 构建,提供跨 6 个能力类别的 26 个工具——让 Agent 能够点击、输入、截图、追踪性能、检查网络流量并在真实浏览器(而非无头存根)中执行 JavaScript。

能力

核心功能

可靠的 UI 自动化

Puppeteer 驱动的点击、填写、拖拽、悬停和键盘操作,内置自动等待逻辑——无需脆弱的 sleep() 技巧。

无障碍树快照

以文本形式捕获任意页面的完整 a11y 树,为 Agent 提供跨操作的稳定元素 UID,无需依赖脆弱的 CSS 选择器。

性能追踪

录制 DevTools 追踪并提取 Core Web Vital 分数(LCP、CLS、FID)及可操作的性能洞察——可选接入 CrUX 真实用户数据。

网络检查

列出、过滤和检查页面上的每个 HTTP 请求和响应——包括请求体、响应头和错误码——跨多次导航。

实时脚本执行

在页面上下文中直接运行任意 JavaScript 函数,并获取 JSON 可序列化的结果。调试状态、查询 DOM 或触发自定义逻辑。

截图与模拟

以 PNG/JPEG/WebP 格式捕获全页面或元素级截图。模拟深色模式、设备视口、地理位置和网络限速条件。

架构

工作原理

MCP 服务器将 Chrome 的 Chrome DevTools Protocol (CDP) 和 Puppeteer 封装成结构化的 MCP 工具。Agent 通过 JSON-RPC 调用工具;服务器将每个调用转换为通过 WebSocket 发往实时 Chrome 实例的 CDP 命令——无论是自动启动的还是通过远程调试端口连接的现有浏览器。

AI Agent 通过 stdio 或 SSE 的 JSON-RPC 发起工具调用
MCP Server 将 MCP 工具转换为 Puppeteer / CDP 命令
CDP / WS 到 Chrome 浏览器进程的 WebSocket 通道
Chrome 实时浏览器——本地启动或远程连接
26
MCP 工具
6
能力类别
CDP
协议底层
3
Chrome 渠道

应用场景

你能做什么

六个能力组,覆盖实时 Chrome 浏览器的完整操作面——从点击像素到分析绘制时间线。

UI 自动化

  • 点击按钮、链接和表单控件
  • 向输入框和文本区域输入内容
  • 在页面元素之间拖放
  • 处理浏览器对话框和模态窗口
  • 通过文件输入上传文件
  • 悬停并触发工具提示

导航

  • 通过编程方式打开和关闭标签页
  • 通过 URL、前进、后退或刷新导航
  • 等待特定文本出现在页面上
  • 多标签页编排与页面选择
  • 控制页面加载和缓存行为
  • 跨会话管理浏览器历史

调试

  • 捕获全页面或元素截图
  • 获取任意页面的无障碍树快照
  • 读取和过滤浏览器控制台消息
  • 在页面上下文中运行任意 JavaScript
  • 检查网络请求和响应体
  • 通过 Core Web Vitals 追踪性能

模拟

  • 模拟深色或浅色模式
  • 限制 CPU 和网络条件
  • 覆盖地理位置(适用于地理感知应用)
  • 模拟自定义视口和设备尺寸
  • 伪造 User-Agent 字符串
  • 在 Slow 3G / Fast 4G 网络配置下测试

性能

  • 录制 DevTools 性能追踪
  • 提取 Core Web Vitals(LCP、CLS、FID)
  • 分析特定性能洞察
  • 通过 CrUX API 测量真实用户数据
  • 将追踪文件保存到磁盘供离线分析
  • 识别页面加载序列中的瓶颈

网络检查

  • 列出上次导航以来的所有请求
  • 按资源类型过滤(XHR、fetch、媒体…)
  • 检查请求和响应体
  • 跨页面导航保留请求
  • 识别失败的请求和错误码
  • 导出网络 HAR 数据进行深度分析

灵活性

三种连接方式

无论是全新无头会话还是接入现有浏览器标签,Browser Control 都能适配。

自动启动

默认

MCP 服务器自动以专用配置文件启动 Chrome。零配置要求——只需配置 MCP 客户端即可使用。

使用持久化的 user-data-dir,状态在会话间保留。

自动连接

Chrome ≥ 144

接入正在运行的 Chrome 实例。非常适合手动测试和 Agent 驱动测试混合使用,而不丢失登录会话。

需要在 chrome://inspect/#remote-debugging 中启用远程调试。

远程调试端口

高级

将服务器指向任意 --remote-debugging-port。通过端口转发在虚拟机、容器和沙箱环境中均可使用。

支持自定义 WebSocket 端点和 Authorization 头。

即将上线

加入候补名单

第一时间获知此插件上线。

加入候补名单