Chrome MCP Server使用

Chrome MCP Server 是一个运行在本地的服务器程序，它与 Chrome 浏览器紧密相连，通过 MCP 协议构建起浏览器与 AI 助手之间的通信桥梁。当我们安装并启动该服务器后，AI 助手（如 Cursor）便能借助这个桥梁，向浏览器发送各种指令，操控浏览器完成复杂任务[^2]。以下是详细的使用方法和指南： ### 安装与配置 #### 环境要求 - **操作系统**：支持 Windows、macOS 和 Linux。 - **浏览器**：需要安装最新版本的 Google Chrome 浏览器。 - **Python**：确保已安装 Python 3.x 版本。 - **Node.js**：需要安装 Node.js 环境。 #### 安装步骤 1. **克隆仓库**：首先，从 GitHub 上克隆 Chrome MCP Server 的源代码仓库。 ```bash git clone https://github.com/your-repo-name/chrome-mcp-server.git ``` 2. **进入项目目录**： ```bash cd chrome-mcp-server ``` 3. **安装依赖**：使用 npm 安装必要的依赖包。 ```bash npm install ``` 4. **启动服务器**：运行以下命令来启动服务器。 ```bash npm start ``` ### 使用方式 #### 1. Streamable HTTP 方式（推荐） 这种方式允许你通过 HTTP 接口与 MCP Server 进行交互。你可以使用任何支持 HTTP 请求的客户端工具（如 Postman 或 curl）来发送请求。 - **发送请求**：向 MCP Server 发送 POST 请求，指定目标 URL 和操作指令。 ```bash curl -X POST http://localhost:3000/mcp -H "Content-Type: application/json" -d '{"url": "https://example.com", "command": "navigate"}' ``` - **接收响应**：服务器会返回执行结果，包括状态码和可能的数据输出。 #### 2. STDIO 方式（备选） 如果你希望直接在命令行中与 MCP Server 交互，可以使用 STDIO 模式。这种方式适用于调试或简单的脚本任务。 - **启动 STDIO 模式**： ```bash node mcp-stdio.js ``` - **输入指令**：在命令行中输入 JSON 格式的指令，例如： ```json {"url": "https://example.com", "command": "navigate"} ``` - **查看输出**：控制台将显示执行的结果，包括页面加载状态和错误信息。 ### 可用工具 Chrome MCP Server 提供了一些内置工具，帮助开发者更高效地进行开发和调试： - **页面导航**：可以控制浏览器跳转到指定的 URL。 - **元素选择**：支持通过 CSS 选择器定位页面上的特定元素。 - **表单填写**：自动填充表单字段并提交。 - **截图功能**：截取当前页面或特定区域的屏幕快照。 - **日志记录**：记录所有操作的日志，便于后续分析和排查问题。 ### 使用示例 以下是一些常见的使用场景示例： #### 示例 1：导航到指定网页 ```bash curl -X POST http://localhost:3000/mcp -H "Content-Type: application/json" -d '{"url": "https://www.google.com", "command": "navigate"}' ``` #### 示例 2：点击页面上的按钮 假设页面上有一个按钮，其 CSS 选择器为 `#submit-button`，你可以通过以下指令模拟点击： ```bash curl -X POST http://localhost:3000/mcp -H "Content-Type: application/json" -d '{"url": "https://example.com", "command": "click", "selector": "#submit-button"}' ``` #### 示例 3：填写表单并提交 如果页面上有用户名和密码输入框，分别用 `#username` 和 `#password` 作为选择器，可以通过以下指令自动填写并提交表单： ```bash curl -X POST http://localhost:3000/mcp -H "Content-Type: application/json" -d '{"url": "https://example.com/login", "command": "fill", "fields": {"#username": "testuser", "#password": "testpass"}, "submit": true}' ``` ### 贡献指南 如果你有兴趣为 Chrome MCP Server 项目做出贡献，可以通过以下方式参与： - **提交 Issue**：报告发现的问题或提出新功能建议。 - **提交 Pull Request**：修复代码中的 bug 或添加新的功能模块。 - **文档改进**：优化现有的文档内容，使其更加清晰易懂。 - **测试与反馈**：积极参与测试，提供详细的反馈信息。 ### 未来发展路线图 项目团队计划在未来版本中引入更多高级功能，包括但不限于： - **增强的安全性**：增加身份验证机制，确保只有授权用户才能访问 MCP Server。 - **扩展性支持**：支持更多的浏览器类型，如 Firefox 和 Safari。 - **性能优化**：进一步提升服务器的响应速度和稳定性。 - **图形界面**：开发图形化用户界面，简化配置和操作流程。 ### 更多文档 对于更详细的使用说明和技术细节，建议查阅官方文档和社区资源。这些资料通常包含最新的 API 参考、最佳实践指南以及常见问题解答。 ---