双接口架构演示

一个展示如何构建MCP服务器与传统Web应用共享业务逻辑的双接口架构演示项目,适用于AI集成和传统Web开发。

  • by jonmatum
  • TypeScript
  • 本地部署
  • 更新于
在 GitHub 查看 jonmatum/mcp-dual-interface-demo

使用说明

MCP双接口演示

双界面架构的完整演示,展示了如何使用共享业务逻辑和AWS良好架构原则与传统web应用程序一起构建MCP服务器。

这表明了什么

该项目展示了 双接口架构 其中,相同的业务逻辑为两者提供动力:

  • 传统Web应用程序:React前端+FastAPI REST API
  • 人工智能集成:用于Kiro CLI和其他AI工具的MCP服务器

这两个接口都直接访问相同的DynamoDB数据库,展示了如何在不牺牲架构的情况下构建支持AI的应用程序。

关键创新

该堆栈展示了如何:

  • 在REST API和MCP服务器之间共享业务逻辑
  • 保持与直接数据库访问的松散耦合
  • 独立缩放每个界面
  • 避免服务之间的级联故障
graph TB
    subgraph "Human Interface"
        A[React Frontend] --> B[FastAPI REST API]
    end
    
    subgraph "AI Interface"
        C[Kiro CLI] --> D[MCP Server stdio]
    end
    
    subgraph "Shared Layer"
        E[Shared Business Logic<br/>todo_service.py]
    end
    
    subgraph "Data Layer"
        F[(DynamoDB)]
    end
    
    B --> E
    D --> E
    E --> F
    
    style E fill:#e1f5fe
    style F fill:#f3e5f5

关键原则:

  • 松耦合:服务直接访问DynamoDB
  • 共享代码:通用业务逻辑 shared/ 模块
  • 独立扩展:每个服务都可以单独扩展
  • 无级联故障:服务互不依赖

堆栈

  • 后端API:快速API+Python 3.11
  • MCP服务器:Python MCP SDK(stdio传输)
  • 前端:React 19+TypeScript+Vite+顺风CSS
  • 数据库:DynamoDB本地
  • 共享逻辑:两个服务都使用Python模块
  • 测试:Vitest
  • 编排:Docker编写

快速开始

# One command to start everything
make start

# Or step by step:
make build
make up
make init-db

服务

  • 前端:http://localhost:5173
  • 后端API:http://localhost:8002
  • DynamoDB管理员:http://localhost:8001
  • DynamoDB本地:http://localhost:8000
  • MCP服务器:stdio(通过Kiro连接)

用法

手动测试(前端)

访问http://localhost:5173通过web UI创建、更新和删除待办事项。

人工智能测试(Kiro+MCP)

添加到您的Kiro配置(~/.config/kiro/mcp_config.json):

{
  "mcpServers": {
    "todo-server": {
      "command": "docker",
      "args": ["exec", "-i", "mcp-server", "python", "server.py"]
    }
  }
}

然后使用Kiro与todos进行交互:

  • “创建待办事项:购买杂货”
  • “列出所有待办事项”
  • “将todo X标记为已完成”

发展

添加新功能:

  1. 更新 shared/todo_service.py 具有业务逻辑
  2. 在中添加REST端点 backend/main.py
  3. 在中添加MCP工具 mcp-server/server.py
  4. 这两个服务使用相同的共享逻辑

运行测试:

make test

项目结构

mcp-dual-interface-demo/
├── shared/              # Shared business logic
│   ├── db.py           # DynamoDB client
│   ├── todo_service.py # Todo operations
│   └── init_db.py      # Table initialization
├── backend/            # FastAPI REST API
├── mcp-server/         # MCP server for Kiro
├── frontend/           # React app
├── docker-compose.yml
├── Makefile
└── mcp-config.json     # Kiro MCP configuration

AWS部署

此架构直接映射到AWS服务:

  • DynamoDB本地 → DynamoDB
  • 快速API → Lambda+API网关 或 ECS/Fargate
  • MCP服务器 → 拉姆达 或 ECS任务
  • 前端 → S3+云前端 或 放大
  • 共享逻辑 → Lambda层 或 共享包

所有服务都保持直接的DynamoDB访问,没有服务间的依赖关系。