YetiBrowser MCP

官方

YetiBrowser MCP 是一个完全开源的解决方案,允许AI助手轻松与您现有的浏览器进行交互。

你可以用 Yeti Browser MCP 做什么?

  • 导航并捕获页面快照 — 让助手使用 browser_navigate 加载 URL,并返回结果页面的无障碍快照。
  • 填写并提交网页表单 — 使用 browser_fill_formbrowser_type 填充多个字段,并可选择提交表单。
  • 检查控制台输出与页面状态 — 通过 browser_get_console_logsbrowser_page_state 检索错误、日志、表单数据、Cookie 及存储键。
  • 在页面中运行自定义 JavaScript — 使用 browser_evaluate 执行任意脚本,并获取可序列化为 JSON 的结果,用于调试或数据提取。
  • 捕获屏幕截图 — 使用 browser_screenshot 截取视口或全页截图,用于视觉验证或 QA 工作流。

文档

[!IMPORTANT] 本项目已归档。它最初是为了解决 Claude 和 Codex 等 AI 代理缺乏浏览器控制能力而构建的,但现在这些代理已内置了相关功能,无需再依赖专门的 MCP 解决方案。

YetiBrowser MCP

YetiBrowser MCP 是 Browser MCP 工作流的完全开源实现。它将基于 Node 的 MCP 服务器与 Chrome/Firefox 扩展连接起来,使 Model Context Protocol 客户端——Codex/Claude Code、Cursor、Windsurf、MCP Inspector 或您自己的工具——能够自动化真实的浏览器标签页,同时确保每个字节都保留在您的机器上且可审计。

为什么选择 YetiBrowser MCP?

  • 透明且可修改 – 无需下载二进制文件。检查、复刻并扩展每个组件。
  • 本地优先 – 扩展仅与本地主机 MCP 服务器通信;浏览数据绝不会离开您的设备。
  • 跨浏览器 – 共享逻辑同时支持 Chrome 和 Firefox 软件包(Firefox 构建因等待更好的 Manifest V3 支持而搁置,因此在 Mozilla 发布完整的 MV3 API 之前,连接体验可能受限)。
  • 面向开发者的工具 – 更丰富的控制台捕获、DOM 差异对比、页面状态转储以及专为调试和 QA 设计的全页面截图。
  • 生产就绪 – 提供用于打包、发布以及与 IDE 工作流集成的脚本和文档。

仓库布局

  • packages/shared – 消息和工具模式的共享 TypeScript 定义。
  • packages/server – 将 MCP 客户端桥接到正在运行的浏览器标签页的 MCP 服务器。
  • extensions/shared – 共享的扩展源代码(后台/弹出窗口)和资源。
  • extensions/chrome / extensions/firefox – 针对不同浏览器的打包层。
  • docs/ – 工作区命令、发布清单和功能说明。
  • scripts/ – 辅助工具,例如用于发布压缩包的 package-extensions.sh

可用的 MCP 工具

  • browser_snapshot – 捕获当前页面的面向无障碍访问的快照
  • browser_snapshot_diff – 比较最近两次快照以突出显示 DOM/ARIA 变化
  • browser_navigate – 在连接的标签页中加载新 URL 并返回更新后的快照
  • browser_go_back / browser_go_forward – 在历史记录中前进/后退,同时保持 MCP 同步
  • browser_wait – 暂停自动化指定的秒数
  • browser_wait_for – 阻塞直到某个选择器出现(可选地可见)再继续
  • browser_press_key – 在聚焦元素上模拟键盘按键
  • browser_click – 点击由 CSS 选择器标识的元素
  • browser_hover – 将指针悬停在目标元素上
  • browser_drag – 将一个元素拖放到放置目标上,用于可排序/拖放式 UI
  • browser_type – 在可编辑元素中输入文本(可选择按回车键提交)
  • browser_fill_form – 在单次调用中填充多个输入框/选择框/复选框/单选按钮
  • browser_select_option – 在 <select> 元素中选择一个或多个选项
  • browser_screenshot – 通过 DevTools 协议捕获视口或全页面截图
  • browser_get_console_logs – 返回最近的控制台输出,包括带有堆栈跟踪的错误
  • browser_page_state – 转储连接页面的表单、存储键和 Cookie
  • browser_connection_info – 报告桥接 WebSocket 端口、连接状态和扩展版本
  • browser_evaluate – 在页面内运行自定义 JavaScript 并返回 JSON 可序列化的结果
  • browser_handle_dialog – 接受或关闭 alert/confirm/prompt 对话框,可附带提示文本

MCP 浏览器扩展安装

Chrome 浏览器

Firefox 浏览器(当前不可用)

  • 由于 Firefox 稳定版中 Manifest v3 的功能有限,Firefox 扩展将暂停,直到完整支持普遍可用(Nightly 构建版本之外)。

MCP 服务器安装

Codex CLI

  • 编辑您的 ~/.codex/config.toml 并添加 MCP 条目:
    [mcp_servers.yetibrowser-mcp]
    command = "npx"
    args = ["-y", "@yetidevworks/server"]
    
  • 重启 codex CLI 命令;您应该会在 /mcp 工具下看到 yetibrowser-mcp 列表。
  • 如果您想提供特定端口,请为 args 条目使用此格式:args = ["-y", "@yetidevworks/server", "--ws-port", "9010"]

Claude Code

  • 确保扩展已安装并连接到标签页,然后使用 npx -y @yetidevworks/server 启动 MCP 服务器(或运行本地构建的 CLI)。
  • 将服务器条目添加到 ~/Library/Application Support/Claude/claude_desktop_config.json(请参阅 docs/publishing.md 中的示例)。
  • 重启 claude 以便其获取新的 MCP 服务器;一旦扩展连接,您应该会在 /mcp 工具菜单下看到 yetibrowser-mcp 列表。

其他支持 MCP 的客户端

  • 任何 MCP 客户端都可以通过生成 CLI (npx -y @yetidevworks/server) 来连接,或者可选择提供特定端口,例如 npx -y @yetidevworks/server --ws-port 9010
  • 服务器通过 stdio 公开标准 MCP 传输,因此请使用您的客户端支持的任何配置机制,在标签页连接时运行上述命令。

MCP Inspector

  • 用于在编码代理之外进行测试和调试。
  • npx @modelcontextprotocol/inspector npx -y @yetidevworks/server -- --ws-port 9010 以结合 YetiBrowser MCP 浏览器扩展运行和检查 MCP 服务器。

故障排除

  • CLI 会遍历端口 9010-9020 直到找到一个空闲端口,并在前进时记录 switched to。如果您想固定特定端口,请传递 --ws-port <port>
  • 浏览器扩展弹出窗口反映了该行为:将其保留在“自动”以跟踪 CLI 的端口,或选择“手动”并输入 browser_connection_info / CLI 日志报告的端口来覆盖它。
  • 只需向您的 AI 工具询问连接端口。例如:what is the yetibrowser mcp connction info?,然后将手动端口设置为报告的端口。

文档和构建脚本