使用MCP服务器控制浏览器的AI代理

简介

MCP(Multi-Control Protocol)服务器是一种允许AI代理控制浏览器的工具,通过使用browser-use包实现浏览器自动化。它支持两种传输模式:SSE(Server-Sent Events)和stdio。

基础知识点

  1. 浏览器自动化:使用Playwright等工具来控制浏览器的行为,如打开网页、点击按钮等。
  2. MCP协议:一种用于AI代理与浏览器之间通信的协议,支持SSE和stdio两种传输方式。
  3. VNC流媒体:允许实时观看浏览器自动化过程。

安装步骤

1. 安装依赖

首先,需要安装uv工具和mcp-proxy

bash 复制代码
curl -LsSf https://astral.sh/uv/install.sh | sh
uv tool install mcp-proxy
uv tool update-shell

2. 配置环境

创建一个.env文件,设置必要的环境变量:

bash 复制代码
OPENAI_API_KEY=your-api-key
CHROME_PATH=optional/path/to/chrome
PATIENT=false  # 设置为true时,API调用将等待任务完成

3. 安装依赖包

使用uv安装必要的Python包:

bash 复制代码
uv sync
uv pip install playwright
uv run playwright install --with-deps --no-shell chromium

运行服务器

SSE模式

直接从源代码运行服务器:

bash 复制代码
uv run server --port 8000

stdio模式

  1. 构建并安装全局包
bash 复制代码
uv build
uv tool uninstall browser-use-mcp-server 2>/dev/null || true
uv tool install dist/browser_use_mcp_server-*.whl
  1. 运行服务器
bash 复制代码
browser-use-mcp-server run server --port 8000 --stdio --proxy-port 9000

客户端配置

SSE模式客户端配置

json 复制代码
{
  "mcpServers": {
    "browser-use-mcp-server": {
      "url": "http://localhost:8000/sse"
    }
  }
}

stdio模式客户端配置

json 复制代码
{
  "mcpServers": {
    "browser-server": {
      "command": "browser-use-mcp-server",
      "args": [
        "run",
        "server",
        "--port",
        "8000",
        "--stdio",
        "--proxy-port",
        "9000"
      ],
      "env": {
        "OPENAI_API_KEY": "your-api-key"
      }
    }
  }
}

Docker部署

使用Docker可以提供一个一致且隔离的环境来运行服务器。

构建Docker镜像

perl 复制代码
bash
docker build -t browser-use-mcp-server .

运行容器

bash 复制代码
docker run --rm -p8000:8000 -p5900:5900 browser-use-mcp-server

自定义VNC密码

创建一个包含密码的文件,然后将其挂载到容器中:

bash 复制代码
echo "your-secure-password" > vnc_password.txt
docker run --rm -p8000:8000 -p5900:5900 \
  -v $(pwd)/vnc_password.txt:/run/secrets/vnc_password:ro \
  browser-use-mcp-server

VNC查看器

使用noVNC作为浏览器查看器:

bash 复制代码
git clone https://github.com/novnc/noVNC
cd noVNC
./utils/novnc_proxy --vnc localhost:5900

默认密码为browser-use,除非使用自定义密码方法覆盖。

示例用法

尝试使用AI代理打开网页并获取顶级文章:

bash 复制代码
open https://news.ycombinator.com and return the top ranked article
相关推荐
weedsfly3 分钟前
纯函数与副作用——前端开发中最容易被忽视的质量保证
前端·javascript·面试
SimonKing4 分钟前
一文终结 SpringBoot 国际化!从 0 到 1 完整案例(中/英/日)
java·后端·程序员
杖雍皓4 分钟前
没有服务器如何构建现代 Web 应用:平台选型与组合策略
运维·服务器·前端·react.js·github·netlify·vercel
轻松的小鸭子5 分钟前
细说ASP.NET Forms身份认证
后端·asp.net
史呆芬10 分钟前
CodeX多仓库提交Skill搭建
git·后端·openai
埃博拉酱13 分钟前
ZEISS Microscopy Installer、ZLMT 及 ZEN 系列软件均因 FlexNet Publisher DLL 崩溃而闪退
后端
fliter17 分钟前
Uber 如何完成超大规模 JUnit 迁移:从 JUnit 4 到 JUnit 5 的自动化工程实践
后端
CodeSheep24 分钟前
南京IT公司六小龙
前端·后端·程序员
IT_陈寒40 分钟前
React useEffect依赖数组把我坑惨了,这次搞明白了
前端·人工智能·后端
环境栈笔记1 小时前
AI 浏览器任务失败怎么排查:Context、Session、Page State 和 Task Log 检查清单
前端·人工智能·后端·自动化