Chrome MCP Server

官方地址

GitHub地址:Chrome MCP Server

基础环境与工具

  • Windows11
  • Chrome( 137.0.7151.120)
  • Cherry Studio

以debug模式启动浏览器

"C:\Users\xx\AppData\Local\Google\Chrome\Application\chrome.exe" --remote-debugging-port=9222 --user-data-dir=d:/fxq/

启动完成后会打开浏览器
在这里插入图片描述

全局安装依赖

npm install @nicholmikey/chrome-tools

配置MCP Server

找到chrome-tools的安装路径

在这里插入图片描述

配置

按照如下进行Cherry Studio的MCP Server配置
在这里插入图片描述

配置完成后可以查看Tool
在这里插入图片描述

测试

选中MCP Server

在这里插入图片描述

对话

输入内容获取第一个页签,并且跳转到跳转到http://www.baidu.com,让其跳转到百度

在这里插入图片描述

### 如何设置基于 Node.js 的 MCP 服务器 #### 背景介绍 MCP(Mail Control Protocol 或其他自定义协议)是一种用于特定应用环境下的通信协议。通过 Node.js 实现 MCP 服务器,可以利用其异步事件驱动模型来处理高并发请求。以下是关于如何构建一个基本的 MCP 服务器的具体方法。 --- #### 安装依赖项 为了创建 MCP 服务器,通常需要安装一些必要的模块。这些模块可能包括但不限于 `express`、`socket.io` 和其他网络库。可以通过以下命令安装基础依赖: ```bash npm install express socket.io body-parser ``` 其中: - **Express**: 提供了一个轻量级框架,便于快速搭建 HTTP 服务[^4]。 - **Socket.IO**: 支持实时双向通信,适合于需要频繁交互的应用场景[^5]。 - **Body-Parser**: 解析传入请求体中的数据,方便后续逻辑操作[^6]。 --- #### 创建核心代码结构 下面是一个简单的示例程序,展示如何使用 Node.js 构建一个支持 MCP 协议的基础服务器: ```javascript // 导入所需模块 const express = require('express'); const http = require('http'); const { Server } = require('socket.io'); // 初始化 Express 应用实例 const app = express(); app.use(express.json()); // 使用 JSON 中间件解析 POST 请求的数据 app.use(express.urlencoded({ extended: true })); // 设置静态资源路径 (可选) app.use('/static', express.static(__dirname + '/public')); // 启动 HTTP 服务并绑定 Socket.IO 到该服务上 const server = http.createServer(app); const io = new Server(server); // 处理客户端连接事件 io.on('connection', (socket) => { console.log(`Client connected with id ${socket.id}`); // 接收来自客户端的消息 socket.on('mcp_message', (data) => { console.log(`Received message from client:`, data); // 发送响应给客户端 const responseMessage = { status: 'success', payload: 'Server received your request!' }; socket.emit('server_response', responseMessage); }); // 断开连接时触发此事件 socket.on('disconnect', () => { console.log(`Client disconnected`); }); }); // 定义 RESTful API 示例接口 app.post('/api/mcp-process', (req, res) => { try { const requestData = req.body; console.log('Processing incoming MCP request:', requestData); // 假设这里执行某些业务逻辑... const responseData = { result: 'processed', details: requestData }; res.status(200).json(responseData); // 返回成功状态码及结果 } catch (error) { console.error(error.message); res.status(500).send('Internal Server Error'); // 错误情况下返回错误信息 } }); // 开启监听端口 const PORT = process.env.PORT || 3000; server.listen(PORT, () => { console.log(`MCP Server is running on port ${PORT}...`); }); ``` --- #### 关键点说明 1. **Socket.IO 集成** 上述代码中集成了 WebSocket 功能以实现实时消息传递功能。如果不需要这种特性,则可以直接移除相关部分[^7]。 2. **REST API 设计** 对于传统的 MCP 数据交换需求,还可以设计一组标准化的 REST APIs 来满足不同类型的调用方式[^8]。 3. **安全性考虑** 在实际部署过程中需要注意安全防护措施,比如启用 HTTPS 加密传输、验证身份认证机制以及限制访问权限等[^9]。 4. **日志记录与监控** 添加详细的运行日志有助于排查问题;同时建议接入专业的 APM 工具来进行性能分析和异常告警[^10]。 --- #### 测试与调试技巧 完成开发之后可通过 Postman 或者 cURL 工具发送测试请求验证接口是否正常工作。另外也可以借助 Chrome DevTools 查看 WebSockets 的通讯情况以便进一步优化体验效果[^11]。 ---
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值