real-browser-mcp
The missing piece in AI coding: your agent can now see your REAL browser.
______________________________________________________________________
你运送一个补丁。你的代理人说“完成，请核实。” 你alt-tab到Chrome，导航到页面，登录，点击，找到bug。
你的代理人刚刚写了代码。它也可以验证它。 它已经打开了你的浏览器。它就是看不见。
现在可以了。
______________________________________________________________________
快速开始
两部分：
- MCP服务器 -在您的机器上运行，与您的AI代理对话
- Chrome 扩展 -位于浏览器中，执行命令
1.添加MCP服务器
光标（单击一次）：
[](cursor://anysphere.cursor-deeplink/mcp/install?name=real-browser&config=eyJjb21tYW5kIjoibnB4IiwiYXJncyI6WyIteSIsInJlYWwtYnJvd3Nlci1tY3AiXX0=)
或者在光标设置>MCP>“添加新的MCP服务器”中手动添加：
{
"mcpServers": {
"real-browser": {
"command": "npx",
"args": ["-y", "real-browser-mcp"]
}
}
}Claude Desktop, Windsurf, or other MCP clients
克劳德桌面： 编辑 ~/Library/Application Support/Claude/claude_desktop_config.json （macOS）或 %APPDATA%\Claude\claude_desktop_config.json （Windows）。添加相同的JSON块。
风浪： 设置>MCP。相同的配置。
任何兼容MCP的客户端都可以工作。
2.安装Chrome扩展程序
[](https://chromewebstore.google.com/detail/real-browser-mcp/fkkimpklpgedomcheiojngaaaicmaidi)
或从源加载：
git clone https://github.com/ofershap/real-browser-mcp.git- 打开
chrome://extensions并启用 开发者模式 （在右上角切换） - 点击 装载时未包装 并选择
extension/克隆仓库中的文件夹
单击工具栏中的Real Browser MCP图标。
绿点=已连接。灰色=正在等待服务器。
完成。您的代理可以看到您的浏览器。
______________________________________________________________________
其他人如何比较
| 真实浏览器MCP | 剧作家MCP | Chrome DevTools MCP | |
|---|---|---|---|
| 使用现有浏览器 | 是 | 否，启动新 | 部分，需要调试端口 |
| 会话和Cookie | 已存在 | 新配置文件 | 手动设置 |
| 是否支持企业SSO | 是 | 否 | 取决于 |
| 设置 | 扩展+MCP配置 | 无头浏览器 | Chrome --remote-debugging-port |
______________________________________________________________________
🧠 教你的经纪人
代理可以开箱即用所有18个工具，但知道后效果会更好 _当_ 和 _怎么_ 把他们锁起来。配置文件教导正确的工作流程——先快照，然后操作，然后验证。
运行一个命令：
npx real-browser-mcp --setup cursor这将安装：
~/.cursor/rules/real-browser-mcp.mdc-教授快照优先的工作流程，如何处理下拉菜单，何时使用截图与快照~/.cursor/commands/check-browser.md-添加/check-browser到您的Cursor聊天
之后，键入 /check-browser 在任何聊天中。或者只需说“在我的浏览器中检查结果”，代理就知道该怎么做。
Claude Code setup
npx real-browser-mcp --setup claude添加一个 AGENTS.md 到你的项目根。Claude Code会自动发现它。
看 agent-config/ 用于手动安装或自定义规则。
______________________________________________________________________
它能做什么
18工具。按目的分组。
看
| 工具 | 它做什么 |
|---|---|
browser_snapshot | 带有元素引用的可访问性树。紧凑模式（默认）仅返回交互式元素 |
browser_screenshot | 捕捉屏幕上的内容 |
browser_text | 从页面或元素中提取原始文本 |
browser_find | 按CSS选择器查询元素 |
互动
| 工具 | 它做什么 |
|---|---|
browser_click | 按引用或CSS选择器单击 |
browser_click_text | 按可见文本单击。通过React门户和覆盖层工作 |
browser_type | 在输入和内容可编辑字段中键入 |
browser_press_key | 组合键（Enter、Escape、Ctrl+A） |
browser_scroll | 滚动页面和虚拟容器 |
browser_hover | 触发工具提示和下拉菜单 |
browser_select | 从本地选择 `` 下降 |
browser_wait | 等待元素出现或消失 |
导航
| 工具 | 它做什么 |
|---|---|
browser_navigate | 转到活动选项卡中的URL |
browser_tabs | 列出、创建、关闭或聚焦选项卡 |
调试
| 工具 | 它做什么 |
|---|---|
browser_console | 控制台输出（日志、警告、错误） |
browser_network | XHR/带状态代码的获取请求 |
browser_evaluate | 通过Chrome DevTools协议运行JavaScript |
browser_handle_dialog | 处理警报/确认/提示对话框 |
______________________________________________________________________
配置
| Env-var | 默认值 | 它的作用 |
|---|---|---|
WS_PORT | 7225 | 用于扩展连接的WebSocket端口 |
连接中断会通过指数回退（1秒到30秒）、每10秒进行一次乒乓球健康检查和每个工具超时（点击5秒，导航60秒）自动处理。
Multiple Chrome profiles
在不同端口上运行两个服务器实例：
{
"mcpServers": {
"browser-work": {
"command": "npx", "args": ["-y", "real-browser-mcp"]
},
"browser-personal": {
"command": "npx", "args": ["-y", "real-browser-mcp"],
"env": { "WS_PORT": "9333" }
}
}
}更新每个扩展弹出窗口中的端口以匹配。
______________________________________________________________________
Architecture
一切都在你的机器上。该扩展通过本地主机上的WebSocket连接到MCP服务器。没有云，没有代理，什么都不会离开你的浏览器。
real-browser-mcp/
├── mcp-server/ MCP server (npm package, TypeScript)
│ └── src/tools/ One file per tool, registry pattern
├── extension/ Chrome extension (Manifest V3, plain JS)
│ ├── background.js Service worker, WebSocket client, tool handlers
│ ├── content.js Console capture
│ └── popup/ Connection status UI
├── agent-config/ Pre-built configs for Cursor + Claude Code
│ ├── cursor/ Rules and commands
│ ├── skills/ Browser automation skill
│ └── setup.mjs One-command installer
└── tests/ Bridge + registry tests堆栈： TypeScript（严格）·MCP SDK·WebSocket·Chrome扩展清单V3·Vitest
Development
git clone https://github.com/ofershap/real-browser-mcp.git
cd real-browser-mcp
npm install
npm run build
npm test| 命令 | 它的作用 |
|---|---|
npm run build | 编译TypeScript |
npm run dev | 观看模式 |
npm test | 运行测试 |
npm run typecheck | 不发射的类型检查 |
npm run setup:cursor | 安装游标规则+命令 |
常见问题解答
Does it work with my logged-in sessions?
这就是重点。该扩展程序在您的实际Chrome浏览器中运行——相同的Cookie、相同的会话、相同的本地存储。无需重新身份验证。
Does it send data anywhere?
不是。MCP服务器和扩展通过本地主机上的WebSocket进行通信。没有任何东西离开你的机器。没有分析，没有遥测，没有云组件。 隐私政策。
Which AI clients work?
任何兼容MCP的客户端。Cursor、Claude Desktop、Claude Code、Windsurf、Cline以及任何其他使用MCP协议的东西。
Can I use it with multiple Chrome profiles?
对。在不同端口上运行两个MCP服务器实例。看 配置 对于设置。
How is this different from Playwright MCP or browser-use?
他们从头开始启动一个新的浏览器实例——没有状态、没有Cookie、没有会话。每次都必须重播完整的登录流程。这将连接到您已经打开的浏览器，其中所有内容都已加载。
______________________________________________________________________
贡献
欢迎Bug报告、功能请求和PR。首先打开一个问题以进行更大的更改。
作者
______________________________________________________________________
README构建于 README生成器