Claude MCP agui

客户支持应用程序-AGUI+MCP+Claude SDK

一个全栈客户支持应用程序，演示了以下功能的集成：

• 阿桂 （代理GUI）-基于React的用户界面
• 主控程序 （模型上下文协议）-用于数据库和电子邮件的工具服务器
• Claude SDK -AI代理编排

先决条件

• Node.js v18或更高版本
• 无烟煤API键

设置

1. 克隆存储库：

git clone https://github.com/YOUR_USERNAME/YOUR_REPO_NAME.git
cd customer-support-app

1. 安装依赖项：

npm install

1. 创建一个 .env 根目录中的文件：

ANTHROPIC_API_KEY=your_api_key_here
PORT=3000

1. 启动服务器：

npm start

1. 打开浏览器并导航到：

http://localhost:3000

项目结构

customer-support-app/
├── mcp-servers/          # MCP tool servers
│   ├── database-server.js
│   └── email-server.js
├── public/               # Frontend
│   └── index.html
├── server.js             # Backend API
├── package.json
└── .env                  # Environment variables (not in git)

用法

尝试以下示例查询：

• “我的订单状态如何john.doe@example.com?"
• “检查订单jane.smith@example.com"
• “向我发送订单ORD-002的跟踪信息”

特性

• 与Claude AI的实时聊天界面
• MCP工具集成（数据库查询、电子邮件发送）
• 可视化工具活动监控
• 多步骤代理工作流

许可证

麻省理工学院