智能MCP服务器聊天应用

一个基于网页的聊天应用,能够智能查找并推荐MCP服务器,并将其集成到聊天会话中以增强AI能力。

  • by imPatidar
  • TypeScript
  • 本地部署
  • 更新于
在 GitHub 查看 impatidar/mcp-server

使用说明

MCP聊天应用程序

一个基于网络的聊天应用程序,可以根据用户需求智能地查找和推荐MCP(模型上下文协议)服务器,并将其集成到聊天会话中,以增强人工智能功能。

特性

  • 💬 交互式聊天界面 -简洁、响应迅速的聊天界面,支持实时消息传递
  • 🔍 智能MCP服务器发现 -用于查找相关MCP服务器的智能推荐引擎
  • 🔧 动态服务器集成 -在聊天会话期间添加/删除MCP服务器
  • 🎯 情境感知建议 -基于对话上下文的人工智能推荐
  • 🚀 实时处理 -快速响应时间和高效的代理处理

建筑

系统组件

前端 (/frontend)

  • React+TypeScript+Vite+顺风CSS
  • 实时聊天界面和MCP服务器管理
  • 服务器浏览、过滤和会话管理

后端 (/backend)

  • Node.js+Express+TypeScript
  • 用于聊天会话和MCP服务器目录的RESTful API
  • 推荐引擎和业务逻辑

代理服务 (/agent-service)

  • Python+FastAPI+OpenAI集成
  • 使用MCP服务器工具执行AI消息处理
  • 上下文管理和工具调用编排

数据流

User Message → Frontend → Backend API → Agent Service → MCP Servers
                    ↓           ↓            ↓
            Session Storage ← Response ← AI Processing

快速开始

  1. 安装依赖项:
npm run install:all
  1. 设置环境变量:
# Backend (.env)
OPENAI_API_KEY=your_openai_key
CORS_ORIGIN=http://localhost:5173
AGENT_SERVICE_URL=http://localhost:8000

# Agent Service (.env)  
OPENAI_API_KEY=your_openai_key
  1. 启动所有服务:
npm run dev

这将开始:

  • 前端:http://localhost:5173
  • 后端:http://localhost:3001
  • 代理服务:http://localhost:8000

项目结构

mcp-chat-app/
├── frontend/                 # React frontend
│   ├── src/
│   │   ├── components/      # UI components
│   │   ├── contexts/        # React contexts
│   │   └── services/        # API services
├── backend/                 # Node.js API server
│   ├── src/
│   │   ├── services/        # Business logic
│   │   ├── data/           # MCP server catalog
│   │   └── routes/         # API endpoints
├── agent-service/          # Python agent service
│   ├── main.py            # FastAPI application
│   └── requirements.txt   # Python dependencies
└── shared/                # Shared TypeScript types

API终点

聊天管理

  • POST /api/chat/sessions -创建新的聊天会话
  • GET /api/chat/sessions/:id -获取会话详细信息
  • POST /api/chat/sessions/:id/messages -发送消息
  • GET /api/chat/sessions/:id/messages -获取消息历史记录

MCP服务器管理

  • GET /api/mcp/servers -列出所有可用服务器
  • POST /api/mcp/servers/search -按查询搜索服务器
  • POST /api/mcp/servers/recommend -获取服务器推荐
  • POST /api/chat/sessions/:id/servers -将服务器添加到会话
  • DELETE /api/chat/sessions/:id/servers/:serverId -删除服务器

MCP服务器集成

该应用程序包括一个精心策划的MCP服务器目录,具有以下功能:

  • 文件操作 -读取、写入和管理文件
  • 数据库访问 -PostgreSQL、SQLite、Redis集成
  • Web服务 -搜索引擎、内容提取
  • 开发工具 -GitHub、Docker、云服务
  • 生产力 -电子邮件、日历、笔记

服务器会根据对话上下文和用户意图自动推荐。

发展

建筑

# Build all components
npm run build

# Build individual components
npm run build:frontend
npm run build:backend

掉毛

# Backend
cd backend && npm run lint

# Frontend  
cd frontend && npm run lint

部署

该应用程序是为使用Docker进行容器化部署而设计的。每个服务都可以独立部署:

  • 前端:nginx提供的静态文件
  • 后端:带Express的Node.js服务器
  • 代理服务:Python FastAPI应用程序

贡献

  1. 分叉存储库
  2. 创建要素分支
  3. 进行更改
  4. 如果适用,添加测试
  5. 提交拉取请求

许可证

MIT许可证-有关详细信息,请参阅许可证文件