如何利用MCP服务器实现浏览器的AI代理控制

今天要给大家介绍的MCP（Multi-Control Protocol）服务器，是一个能让AI代理控制浏览器的实用工具，它借助browser-use包实现了浏览器自动化功能，并且支持SSE（Server-Sent Events）和stdio这两种传输模式。下面就为大家详细讲解如何使用它。

一、基础知识点速览

（一）浏览器自动化

浏览器自动化，简单来说，就是借助像Playwright这样的工具，让程序去控制浏览器完成各种操作。比如自动打开网页、模拟点击按钮、填写表单等，能大幅提高一些重复性操作的效率。

（二）MCP协议

MCP协议是专门用于AI代理和浏览器之间通信的一种协议。它支持SSE和stdio这两种传输方式,实现各种控制指令的传递。

（三）VNC流媒体

VNC流媒体则允许我们实时观看浏览器自动化的整个过程。

二、安装MCP服务器的详细步骤

（一）安装依赖

在安装MCP服务器之前，需要先安装uv工具和mcp-proxy，可以通过以下命令完成：

curl -LsSf https://astral.sh/uv/install.sh | sh uv tool install mcp-proxy uv tool update-shell

curl -LsSf https://astral.sh/uv/install.sh | sh这条命令的作用是从指定的网址获取uv工具的安装脚本，并直接在本地运行安装；uv tool install mcp-proxy用于安装mcp-proxy；uv tool update-shell则是对相关的shell进行更新。

（二）配置环境

安装好依赖后，要创建一个.env文件来设置必要的环境变量，示例如下：

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

其中，OPENAI_API_KEY需要替换为你自己的OpenAI API密钥；CHROME_PATH是指定Chrome浏览器的路径，如果不填则可能使用默认路径；PATIENT这个变量设置为true时，API调用会等待任务完成，设置为false时则可能不会等待。

（三）安装依赖包

接下来，使用uv安装必要的Python包：

uv sync uv pip install playwright uv run playwright install --with-deps --no-shell chromium

uv sync用于同步更新相关的工具和包；uv pip install playwright安装playwright这个重要的工具包，它是实现浏览器自动化的关键；uv run playwright install --with-deps --no-shell chromium则是安装chromium浏览器及其相关依赖，确保playwright能正常控制浏览器。

三、运行服务器的不同模式

（一）SSE模式

如果想以SSE模式运行服务器，可以直接从源代码运行，命令如下：

uv run server --port 8000

这里的--port 8000表示将服务器运行在8000端口上，你可以根据实际需求修改端口号。

（二）stdio模式

构建并安装全局包：

uv build uv tool uninstall browser-use-mcp-server 2>/dev/null || true uv tool install dist/browser_use_mcp_server-*.whl

uv build用于构建相关的包；uv tool uninstall browser-use-mcp-server 2>/dev/null || true尝试卸载可能已存在的browser-use-mcp-server；uv tool install dist/browser_use_mcp_server-*.whl则是安装构建好的browser-use-mcp-server包，其中*是通配符，会匹配符合命名规则的包。
2. 运行服务器：

browser-use-mcp-server run server --port 8000 --stdio --proxy-port 9000

这条命令同样将服务器运行在8000端口上，--stdio表示使用stdio传输模式，--proxy-port 9000指定了代理端口为9000。

四、客户端配置方法

（一）SSE模式客户端配置

SSE模式下，客户端配置如下：

{ "mcpServers": { "browser-use-mcp-server": { "url": "http://localhost:8000/sse" } } }

这里指定了mcpServers中browser-use-mcp-server的访问地址为http://localhost:8000/sse，即指向SSE模式下运行在本地8000端口的服务器。

（二）stdio模式客户端配置

stdio模式的客户端配置如下：

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

在这个配置中，command指定了要执行的命令为browser-use-mcp-server；args是命令的参数，与运行stdio模式服务器时的参数一致；env则用于设置环境变量，这里再次设置了OPENAI_API_KEY。

五、使用Docker部署MCP服务器

使用Docker部署MCP服务器，可以提供一个稳定且隔离的运行环境。

（一）构建Docker镜像

构建Docker镜像的命令如下：

docker build -t browser-use-mcp-server.

docker build是构建镜像的命令，-t browser-use-mcp-server为镜像指定了一个标签，方便后续使用，最后的.表示构建上下文为当前目录。

（二）运行容器

构建好镜像后，运行容器的命令如下：

docker run --rm -p8000:8000 -p5900:5900 browser-use-mcp-server

docker run用于运行容器，--rm表示容器停止后自动删除；-p8000:8000和-p5900:5900分别将容器内的8000端口和5900端口映射到本地的8000端口和5900端口，browser-use-mcp-server是要运行的镜像名称。

（三）自定义VNC密码

如果想要自定义VNC密码，可以按照以下步骤操作：

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

首先，echo "your-secure-password" > vnc_password.txt将自定义的密码写入vnc_password.txt文件；然后在运行容器时，通过-v $(pwd)/vnc_password.txt:/run/secrets/vnc_password:ro将本地的vnc_password.txt文件挂载到容器内的/run/secrets/vnc_password路径下，并设置为只读模式，这样就实现了自定义VNC密码。

六、使用VNC查看器

可以使用noVNC作为浏览器查看器，操作命令如下：

git clone https://github.com/novnc/noVNC cd noVNC ./utils/novnc_proxy --vnc localhost:5900

git clone https://github.com/novnc/noVNC用于从GitHub上克隆noVNC项目；cd noVNC进入项目目录；./utils/novnc_proxy --vnc localhost:5900则是启动noVNC代理，连接到本地5900端口，这样就能通过浏览器实时查看浏览器自动化的过程。默认密码是browser-use，当然，如果使用了自定义密码方法，就需要使用自定义的密码。

七、示例用法

最后给大家展示一个简单的示例，尝试使用AI代理打开网页并获取顶级文章，可以在相应的操作环境中输入以下指令：

open https://news.ycombinator.com and return the top ranked article

这条指令会让AI代理打开https://news.ycombinator.com这个网页，并返回页面上排名靠前的文章，大家可以根据实际需求修改指令。

通过以上步骤，相信大家对使用MCP服务器控制浏览器的AI代理有了更清晰的认识，赶紧动手试试吧！