🚀 Chrome 工具 MCP 服务器
Chrome 工具 MCP 服务器是一个可通过 Chrome 的 DevTools 协议进行交互的工具。借助该服务器，你能够远程控制 Chrome 标签页，实现执行 JavaScript、截取屏幕截图、监控网络流量等操作。
🚀 快速开始
Chrome 工具 MCP 服务器允许你借助 Chrome 的 DevTools 协议与 Chrome 进行交互。它可以实现远程控制 Chrome 标签页，执行 JavaScript 代码、截取屏幕截图、监控网络流量等功能。
✨ 主要特性
- 列出 Chrome 标签页
- 在标签页中执行 JavaScript
- 截取屏幕截图
- 监控网络流量
- 将标签页导航到 URL
- 查询 DOM 元素
- 单击元素并捕获控制台输出
📦 安装指南
安装依赖
npm install @nicholmikey/chrome-tools
配置环境变量
通过 MCP 设置中的环境变量进行配置：
{
"chrome-tools": {
"command": "node",
"args": ["path/to/chrome-tools/dist/index.js"],
"env": {
"CHROME_DEBUG_URL": "http://localhost:9222",
"CHROME_CONNECTION_TYPE": "direct",
"CHROME_ERROR_HELP": "custom error message"
}
}
}
环境变量说明
| 属性 | 详情 |
|---|---|
CHROME_DEBUG_URL |
Chrome 远程调试接口的 URL（默认：http://localhost:9222） |
CHROME_CONNECTION_TYPE |
日志中的连接类型标识符（例如，"direct"、"ssh - tunnel"、"docker"） |
CHROME_ERROR_HELP |
连接失败时显示的错误消息 |
不同环境安装说明
本地环境
- 打开终端并运行以下命令：
npm install @nicholmikey/chrome-tools - 在项目目录中创建一个配置文件
config.json，并在其中添加以下内容：{ "chrome-tools": { "command": "node", "args": ["path/to/chrome-tools/dist/index.js"], "env": { "CHROME_DEBUG_URL": "http://localhost:9222" } } } - 启动服务器：
node index.js
WSL 环境
- 在 WSL 中安装 Node.js 和 npm。
- 安装 chrome - tools 包：
npm install @nicholmikey/chrome-tools - 创建配置文件并启动服务器，与本地环境相同。
Docker 环境
- 创建一个
Dockerfile，内容如下：FROM node:latest WORKDIR /app COPY package.json . RUN npm install COPY . . CMD ["node", "index.js"] - 构建 Docker 镜像：
docker build -t chrome-tools . - 运行容器：
docker run --name chrome-tools-container -p 9222:9222 chrome-tools
💻 使用示例
基础用法
以下是一些常用操作的代码示例：
列出标签页
listTabs()
执行脚本
executeScript(tabId, script)
截取屏幕截图
captureScreenshot(tabId)
监控网络流量
monitorNetworkTraffic(tabId, duration, filters)
导航到 URL
navigateToUrl(tabId, url)
查询 DOM 元素
querySelectorElements(tabId, selector)
单击元素
clickElement(tabId, selector)
📄 许可证
本项目采用 MIT 许可证。