AI导哈

MCP服务器

一个基于FastAPI和React的模型上下文协议（MCP）服务器，支持LLM集成和工具增强交互。

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

使用说明

简单mcp服务器

🧠 带有React前端的简单MCP服务器

这是一个对初学者友好的模型上下文协议（MCP）风格服务器的实现，具有React+Tailwind+shadcn/ui前端。它演示了如何构建和测试与LLM的上下文感知、工具增强的交互。

🚀 特性

  • 🧠 MCP风格的FastAPI服务器
  • 🔢 内置计算器工具布线
  • 👤 用户特定上下文+权限
  • 🧑‍💻 React+Vite前端（带顺风和shadcn/ui）
  • 🌐 通过OpenAI集成LLM（GPT-4）

📦 后端设置（Python）

需求

  • Python 3.9+
  • openai, fastapi, uvicorn, pydantic

安装并运行

python -m venv venv
source venv/bin/activate  # or venv\Scripts\activate on Windows
pip install -r requirements.txt
export OPENAI_API_KEY=your-openai-key  # Or set it in code (not recommended)
uvicorn mcp_server:app --reload

API请求示例

{
  "user_id": "user123",
  "task": "calculate 3 + 7 * 2",
  "use_tools": true
}

示例响应

{
  "tool_used": "calculator",
  "result": "17"
}

💻 前端设置（Vite+React）

安装

cd mcp-client
npm install
npm run dev

顺风+遮阳cn/ui设置

npm install -D tailwindcss postcss autoprefixer
npx tailwindcss init -p

# Configure `tsconfig.json`:
"baseUrl": ".",
"paths": { "@/*": ["src/*"] }

# Vite alias (vite.config.ts):
import path from "path";
resolve: {
  alias: {
    "@": path.resolve(__dirname, "./src")
  }
}

# Add shadcn/ui components
npx shadcn@latest init
npx shadcn@latest add card button input

🧠 文件夹结构

.
├── backend/
│   └── mcp_server.py
├── mcp-client/
│   ├── src/
│   │   ├── MCPClient.tsx
│   │   └── App.tsx
│   └── tailwind.config.js

✨ 路线图创意

  • []添加更多工具（例如天气、待办事项、代码运行器）
  • []多用户配置文件/身份验证
  • []内存+会话历史记录
  • []流式传输LLM响应
  • []部署（渲染+Vercel）

🔑 环境变量

要启用其他工具（天气、股票等），请向.env文件添加密钥：

.env.示例

相关 MCP