浏览器代理桥
AI代理网络应用程序的剧作家mcp，只需要安装一个chrome扩展程序。
为什么？
由于身份验证障碍（登录、2FA、验证码）和基于点击的导航，人工智能代理在很大程度上仍然无法访问网络，这些障碍无法通过服务器端无头浏览器安全地自动化。
对于代理开发人员来说，许多web应用程序也缺乏足够的API或MCP支持。而且，由每个代理开发人员为每个web应用程序构建专用的浏览器自动化解决方案并不划算。
终端用户也不应该自己解决这个问题——非开发人员发现很难安装和运行Playwright MCP或Puppeteer等通用自动化工具。
浏览器代理桥通过以下方式解决了这些挑战：
- 为用户提供直接与最终用户浏览器集成的安全RPA浏览器扩展
- 为开发人员提供简单的SDK，以将AI代理与扩展集成
- 无需复杂的本地安装或每个应用程序的浏览器扩展
演示
架构摘要
该架构使用反向消息流，通过浏览器验证的来源提供强大的安全性：
Node Server ←WebSocket→ Web Page (Tab) ←postMessage→ Browser Extension流动
- AI代理进行工具调用 通过
@browser-agent-bridge/ai-sdk
- SDK通过标准HTTP/WebSocket向Node服务器发送命令
- 开发人员的服务器通过WebSocket向网页发送命令
- 网页连接到其自己的服务器（例如。， wss://app.example.com/ws) - 服务器将自动化命令推送到网页
- 网页通过postMessage将命令转发到浏览器扩展
- 用途 window.postMessage() 具有浏览器验证的来源 - 扩展通过内容脚本接收命令 - event.origin 由浏览器加密验证（不能伪造）
- 浏览器扩展验证并执行
- 从浏览器验证来源 event.origin - 检查请求源的权限 - 在需要时显示弹出式UI供用户审批 - 强制标签隔离（仅会话访问他们创建的标签） - 使用以下命令执行DOM操作 @browser-agent-bridge/dom-core
- 结果通过同一链返回
- 扩展→ 发送消息→ 网页→ 网络套接字→ 服务器→ AI 代理
graph TB
subgraph "Server"
AI[Vercel AI SDK]
BAAISDK[browser-agent-bridge/ai-sdk]
end
subgraph "Agent Web Page Tab"
Bridge[Bridge Script]
ChatUI[Chat UI]
CS[Extension Content Script]
end
subgraph "Browser Extension"
SW[Service Worker]
Popup[Popup for Permission Requests]
end
subgraph "Target Web Page Tab"
CST[Extension Content Script]
Target[Target UI]
end
AI -->|tools|BAAISDK
BAAISDK |WebSocket| Bridge
AI ChatUI
Bridge |postMessage| CS
CS -->|chrome.runtime.sendMessage| SW
SW -->|show| Popup
Popup -->|user decision| SW
SW -->|chrome.tabs.sendMessage| CS
SW -->|tool call| CST
CST -->|browser-agent-bridge/dom-core| Target安全模型
- 用户按来源授予权限
- Origin使用postMessage（）事件进行验证。Origin
- 会话只能访问它创建的选项卡
- 这些可以防止CSRF指向用户允许的选项卡以外的其他选项卡
看 docs/security-model.md 获取详细的安全文档。