Chat Royale

使用Gemini 2.0和MCP工具实现实时游戏数据访问的AI驱动Clash Royale代理。

完整技术详解

我最近撰写了一篇关于架构、构建过程以及其他有关此项目的有趣内容的技术分析。你可以在我的网站上阅读它：

完整技术详解

架构

三个容器化服务：

MCP服务器 (src/mcp/) - 使用Python FastMCP服务器公开Clash Royale API工具：

• 玩家、部落、卡牌、排名

后端API (src/backend/) - Node.js/Express服务器：

• 通过@modelcontextprotocol/sdk集成Gemini与MCP客户端
• 标准的JSON请求/响应（无流式传输）
• 工具执行在内部通过迭代Gemini调用处理

前端 (src/frontend/) - React/TypeScript用户界面：

• 支持Markdown的简单聊天界面
• 向后端API发出标准HTTP请求

工作原理

1. 用户向前端发送消息
2. 前端将消息发布到后端的/api/chat
3. 后端连接到MCP服务器并发现工具
4. Gemini使用可用工具处理消息
5. 如果需要工具：后端通过MCP执行，并将结果反馈给OpenAI
6. 最终响应作为JSON返回给前端

部署

生产环境：AWS Lightsail搭配Cloudflare CDN

持续集成/持续部署：GitHub Actions在main分支推送/合并时自动部署

# 部署
docker-compose -f docker-compose.prod.yml up -d --build

开发

# 环境设置
# 后端：src/backend/.env - GEMINI_API_KEY
# MCP：src/mcp/.env - CR_API_KEY

# 运行所有服务
docker-compose up -d

技术栈

• MCP服务器：Python 3.12, FastMCP, Clash Royale API
• 后端：Node.js, Express, TypeScript, Gemini SDK
• 前端：React, TypeScript, Vite, TailwindCSS
• 部署：Docker, AWS Lightsail, Cloudflare, GitHub Actions