Chrome MCP 服务器

一个提供对Chrome浏览器实例精细控制的模型上下文协议（MCP）服务器，通过Chrome调试工具协议（CDP）实现。

先决条件

• Bun（推荐）或Node.js（v14或更高版本）
• 启用远程调试功能的Chrome浏览器

安装步骤

安装Bun

1. 安装Bun（如果尚未安装）：

# macOS、Linux 或 WSL
curl -fsSL https://bun.sh/install | bash

# Windows（使用 PowerShell）
powershell -c "irm bun.sh/install.ps1 | iex"

# 或者使用 npm
npm install -g bun

2. 启动Chrome浏览器并启用远程调试功能：

# macOS
/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --remote-debugging-port=9222

# Windows
start chrome --remote-debugging-port=9222

# Linux
google-chrome --remote-debugging-port=9222

3. 安装依赖项：

bun install

4. 启动服务器：

bun start

使用热重载进行开发：

bun dev

服务器将默认在3000端口启动。您可以通过设置PORT环境变量来更改端口。

配置Roo Code以使用此MCP服务器

要在Roo Code中使用此Chrome MCP服务器：

1. 打开Roo Code设置

2. 导航到MCP设置配置文件的位置：

   • macOS：~/Library/Application Support/Code/User/globalStorage/rooveterinaryinc.roo-cline/settings/cline_mcp_settings.json
   • Windows：%APPDATA%\Code\User\globalStorage\rooveterinaryinc.roo-cline\settings\cline_mcp_settings.json`
   • Linux：~/.config/Code/User/globalStorage/rooveterinaryinc.roo-cline/settings/cline_mcp_settings.json

3. 在mcpServers对象中添加以下配置：

{
  "mcpServers": {
    "chrome-control": {
      "url": "http://localhost:3000/sse",
      "disabled": false,
      "alwaysAllow": []
    }
  }
}

4. 保存文件并重新启动Roo Code以应用更改。

5. 您现在可以在Roo Code中使用Chrome MCP工具来控制浏览器。

可用工具

服务器提供了以下用于浏览器控制的工具：

navigate

导航到特定URL。

参数：

• url（字符串）：要导航到的URL

click

在指定坐标处点击。

参数：

• x（数字）：X轴坐标
• y（数字）：Y轴坐标

type

在当前焦点输入文本。

参数：

• text（字符串）：要输入的文本

clickElement

通过元素索引在页面信息中点击元素。

参数：

• selector（字符串）：元素索引（例如，“0”表示第一个元素）

getText

使用CSS选择器获取元素的文本内容。

参数：

• selector（字符串）：用于查找元素的CSS选择器

getPageInfo

获取页面的语义信息，包括交互式元素和文本节点。

getPageState

获取当前页面状态，包括URL、标题和是否加载完成。

开发说明

使用Bun启动开发模式：

bun dev

此命令将启用热重载功能，方便您在开发过程中实时更新代码。