BRMS——浏览器运行时MCP服务器
将实时浏览器状态(DOM、网络、控制台、样式、布局)作为结构化MCP工具公开给Cursor等AI代理。
建筑
Chrome Extension ←→ Native Messaging ←→ brms-host (Node.js) ←→ Cursor (HTTP MCP)
- Chrome 扩展 (Manifest V3):原生捕获DOM、网络、控制台、样式和屏幕截图
- brms主机 (Node.js):MCP服务器上
http://localhost:3100/mcp 使用流式HTTP传输 - 本地消息传递:Chrome在扩展程序和主机进程之间的内置IPC
快速开始
1.加载Chrome扩展程序
- 打开
chrome://extensions - 启用 开发者模式
- 点击 装载时未包装 → 选择
extension/ 文件夹 - 复制 扩展ID 卡片(32个字符串)
2.安装本机消息主机
如果 brms-host 发布在npm上:
npx brms-host install --extension-id=
如果从源代码运行:
cd host
npm install
npm run build
node build/bin/install.js install --extension-id=
3.配置光标
添加到您的项目 .cursor/mcp.json:
{
"mcpServers": {
"brms": {
"url": "http://localhost:3100/mcp"
}
}
}
4.验证
点击Chrome浏览器中的BRMS扩展图标——它应该显示 连接。然后问Cursor: *“连接到我的浏览器并列出打开的选项卡。”*
可用工具(15)
连接
| 工具 | 说明 |
|---|
connect_browser | 通过Chrome扩展程序连接到浏览器 |
list_pages | 列出所有打开的选项卡 |
select_page | 按索引选择选项卡 |
DOM检查
| 工具 | 说明 |
|---|
get_dom_tree | 完整或范围DOM树快照 |
query_dom | 带属性的CSS选择器查询 |
网络
| 工具 | 说明 |
|---|
get_network_calls | 通过过滤捕获网络请求 |
控制台
| 工具 | 说明 |
|---|
get_console_errors | 控制台错误和警告 |
样式和布局
| 工具 | 说明 |
|---|
get_computed_styles | 使用祖先链和伪元素计算CSS |
get_layout_info | 边界框、可见性、重叠、剪切、滚动 |
get_visible_elements | 视口中带有11y信息的交互元素 |
视觉的
| 工具 | 说明 |
|---|
capture_screenshot | 带有突出显示选项的页面或元素截图 |
事件
| 工具 | 说明 |
|---|
get_event_listeners | 通过Chrome DevTools协议的事件监听器 |
AI调试
| 工具 | 说明 |
|---|
debug_element | 可点击性/可见性的11点诊断 |
diagnose_network | 定时、CORS、速率限制、错误体分析 |
correlate_issues | 交叉引用网络、控制台和DOM问题 |
项目结构
golliath/
├── shared/
│ └── protocol.ts # Message types (host ↔ extension)
├── extension/
│ ├── manifest.json # Chrome MV3 manifest
│ ├── background.js # Service worker (native messaging, debugger, routing)
│ ├── content.js # DOM operations (styles, layout, debug)
│ ├── popup.html/js/css # Setup wizard + status UI
│ └── icons/
├── host/
│ ├── package.json # Publishable as "brms-host"
│ ├── tsconfig.json
│ └── src/
│ ├── index.ts # HTTP server + Streamable HTTP transport
│ ├── server.ts # McpServer + 15 tool registrations
│ ├── bin/install.ts # npx brms-host install
│ ├── bridge/ # Native messaging protocol
│ ├── browser/ # Proxy layer (via bridge)
│ ├── tools/ # MCP tool handlers
│ ├── types/ # TypeScript interfaces
│ └── utils/ # Logger, error helpers
├── package.json # Root workspace
└── README.md
发展
# Install all dependencies
npm install
# Build the host
npm run build
# Watch mode
npm run dev
更改主机后,在Chrome中重新加载BRMS扩展程序以获取新版本。
运作原理
- 当Chrome扩展程序启动时,它会连接到本机消息主机
- 主机在端口3100上启动HTTP服务器
- 光标连接到
http://localhost:3100/mcp 通过流式HTTP MCP传输 - 工具调用流程: 光标→ Host → 扩展→ 浏览器→ 扩展→ Host → 光标
- 网络和控制台数据实时从扩展推送
故障排除
| 症状 | 修复 |
|---|
| 弹出窗口显示“已断开连接” | 重新加载扩展 chrome://extensions |
| “本机主机已退出”错误 | 使用正确的扩展ID再次运行安装命令 |
| 端口3100已在使用中 | 杀死过时的主机: `lsof -ti :3100 \ | xargs kill` 然后重新加载扩展名 |
| 工具返回“扩展未连接” | 调用 connect_browser 首先 |
隐私
Chrome Web Store发布需要此扩展程序的权限配置文件的隐私政策。\ 使用 PRIVACY_POLICY.md 在您的列表的此存储库中(或托管等效的策略URL)。
许可证
麻省理工学院