MCP Demo Project
A demonstration server implementing the Model Context Protocol (MCP) with both STDIO and Server-Sent Events (SSE) support, featuring a word reversal tool that transforms input text by reversing characters.
Category
Tools
reverse_word
Reverses the characters in a given word
README
🌟 MCP Demo Project 🌟
███╗ ███╗ ██████╗██████╗ ██████╗ ███████╗███╗ ███╗ ██████╗
████╗ ████║██╔════╝██╔══██╗ ██╔══██╗██╔════╝████╗ ████║██╔═══██╗
██╔████╔██║██║ ██████╔╝ ██║ ██║█████╗ ██╔████╔██║██║ ██║
██║╚██╔╝██║██║ ██╔═══╝ ██║ ██║██╔══╝ ██║╚██╔╝██║██║ ██║
██║ ╚═╝ ██║╚██████╗██║ ██████╔╝███████╗██║ ╚═╝ ██║╚██████╔╝
╚═╝ ╚═╝ ╚═════╝╚═╝ ╚═════╝ ╚══════╝╚═╝ ╚═╝ ╚═════╝
🔄 Word Reversal Server with Server-Sent Events Support 🔄
A comprehensive demonstration of Model Context Protocol (MCP) server with Server-Sent Events (SSE) support and a word reversal tool.
🎨 Visual Architecture
┌─────────────────────────────────────────────────────────────────┐
│ 🌟 MCP DEMO ECOSYSTEM 🌟 │
├─────────────────────────────────────────────────────────────────┤
│ │
│ 📡 STDIO Mode 🌐 SSE Mode │
│ ┌─────────────┐ ┌─────────────┐ │
│ │ Client │◄─────STDIO─────►│ Client │ │
│ │ 📱 │ │ 📱 │ │
│ └─────────────┘ └─────────────┘ │
│ │ │ │
│ ▼ ▼ │
│ ┌─────────────┐ ┌─────────────┐ │
│ │ MCP Server │ │ MCP Server │ │
│ │ 🖥️ │ │ 🖥️ │ │
│ └─────────────┘ └─────────────┘ │
│ │ │ │
│ ▼ ▼ │
│ ┌─────────────────────────────────────────────────────────┐ │
│ │ 🔄 Word Reversal Tool 🔄 │ │
│ │ "hello" ➜ "olleh" │ │
│ │ "world" ➜ "dlrow" │ │
│ │ "demo" ➜ "omed" │ │
│ └─────────────────────────────────────────────────────────┘ │
└─────────────────────────────────────────────────────────────────┘
🚀 Features Showcase
🎯 FEATURES MATRIX
┌────────────────┬─────────────┬─────────────┐
│ Feature │ STDIO Mode │ SSE Mode │
├────────────────┼─────────────┼─────────────┤
│ MCP Protocol │ ✅ │ ✅ │
│ Word Reversal │ ✅ │ ✅ │
│ Type Safety │ ✅ │ ✅ │
│ Error Handling │ ✅ │ ✅ │
│ Health Check │ ❌ │ ✅ │
│ HTTP Endpoint │ ❌ │ ✅ │
│ Real-time │ ⚡ │ 🌊 │
└────────────────┴─────────────┴─────────────┘
📦 Quick Start
🔧 INSTALLATION STEPS
┌─────────────────────────────────────────┐
│ 1️⃣ npm install │
│ 2️⃣ npm run build │
│ 3️⃣ npm run demo:stdio OR │
│ npm run demo:sse │
└─────────────────────────────────────────┘
🎯 Usage Options
🔌 Option 1: STDIO Mode (Traditional MCP)
┌─────────────────────────────────────────────────────────────┐
│ 🔌 STDIO WORKFLOW │
├─────────────────────────────────────────────────────────────┤
│ │
│ Terminal 1: 🖥️ Server Terminal 2: 📱 Client │
│ ┌─────────────────────┐ ┌─────────────────────┐ │
│ │ npm run start │ │ npm run client │ │
│ │ │ ◄───► │ │ │
│ │ Server running... │ │ Testing tools... │ │
│ └─────────────────────┘ └─────────────────────┘ │
│ │
│ OR use combined command: │
│ 🚀 npm run demo:stdio │
└─────────────────────────────────────────────────────────────┘
🌐 Option 2: SSE Mode (Server-Sent Events)
┌─────────────────────────────────────────────────────────────┐
│ 🌐 SSE WORKFLOW │
├─────────────────────────────────────────────────────────────┤
│ │
│ Terminal 1: 🌊 SSE Server Terminal 2: 📡 SSE Client │
│ ┌─────────────────────┐ ┌─────────────────────┐ │
│ │ npm run start:sse │ │ npm run client:sse │ │
│ │ │ HTTP │ │ │
│ │ Port 3000 active... │ ◄───► │ Connecting via SSE │ │
│ │ Health: ✅ │ │ Testing tools... │ │
│ └─────────────────────┘ └─────────────────────┘ │
│ │
│ OR use combined command: │
│ 🚀 npm run demo:sse │
└─────────────────────────────────────────────────────────────┘
🛠️ Development Arsenal
⚡ DEVELOPMENT COMMANDS
┌────────────────────────────────────────────────────────────┐
│ │
│ 🔥 Hot Reload: │
│ ├─ npm run dev # STDIO server with auto-restart │
│ └─ npm run dev:sse # SSE server with auto-restart │
│ │
│ 🔍 Quality Checks: │
│ ├─ npm run typecheck # TypeScript validation │
│ ├─ npm run lint # Code style checking │
│ └─ npm run test # Test suite execution │
│ │
│ 🚀 Production: │
│ ├─ npm run build # Compile to JavaScript │
│ └─ npm run start # Production server │
└────────────────────────────────────────────────────────────┘
📁 Project Architecture
📂 PROJECT STRUCTURE
├── 📁 src/
│ ├── 🖥️ server.ts # MCP STDIO Server
│ ├── 🌐 sse-server.ts # MCP SSE Server
│ ├── 📱 client.ts # STDIO Test Client
│ └── 📡 sse-client.ts # SSE Test Client
├── 📁 dist/ # Compiled JavaScript
├── 📄 package.json # Dependencies & Scripts
├── 📄 tsconfig.json # TypeScript Config
├── 📄 eslint.config.js # Code Quality Rules
└── 📖 README.md # This beautiful file!
🎨 COMPONENT RELATIONSHIPS
┌─────────────────────────────────────────────────────────┐
│ │
│ 📱 client.ts ◄─────STDIO─────► 🖥️ server.ts │
│ │
│ 📡 sse-client.ts ◄───HTTP/SSE───► 🌐 sse-server.ts │
│ │
│ Both connect to: 🔄 Word Reversal Logic │
└─────────────────────────────────────────────────────────┘
🔧 API Documentation
🛠️ Available Tools
🔄 reverse_word Tool
┌─────────────────────────────────────────────────────────────┐
│ 🔄 WORD REVERSAL API │
├─────────────────────────────────────────────────────────────┤
│ │
│ 📥 INPUT: │
│ { │
│ "name": "reverse_word", │
│ "arguments": { │
│ "word": "hello" │
│ } │
│ } │
│ │
│ 📤 OUTPUT: │
│ { │
│ "content": [ │
│ { │
│ "type": "text", │
│ "text": "Reversed word: \"olleh\"" │
│ } │
│ ] │
│ } │
└─────────────────────────────────────────────────────────────┘
🌐 SSE Server Endpoints
🔗 ENDPOINT MAP
┌─────────────────────────────────────────────────────┐
│ │
│ 🏥 GET /health │
│ └─ Returns server health status │
│ │
│ 📡 GET /sse │
│ └─ Server-Sent Events MCP endpoint │
│ │
│ Example: http://localhost:3000/health │
│ Response: {"status": "healthy", "server": "..."} │
└─────────────────────────────────────────────────────┘
🧪 Testing Showcase
🔬 COMPREHENSIVE TEST SUITE
┌─────────────────────────────────────────────────────────────┐
│ │
│ ✅ Connection Tests ✅ Tool Discovery │
│ ├─ STDIO transport ├─ List available tools │
│ └─ SSE transport └─ Validate tool schemas │
│ │
│ ✅ Tool Execution ✅ Error Handling │
│ ├─ Word reversal ├─ Invalid inputs │
│ └─ Multiple test cases └─ Connection failures │
│ │
│ 🎯 TEST CASES: │
│ ┌─────────────────────────────────────────────────────┐ │
│ │ "hello" ➜ "olleh" "server" ➜ "revres" │ │
│ │ "world" ➜ "dlrow" "demo" ➜ "omed" │ │
│ │ "mcp" ➜ "pcm" "sse" ➜ "ess" │ │
│ └─────────────────────────────────────────────────────┘ │
└─────────────────────────────────────────────────────────────┘
🏗️ System Architecture
🔌 STDIO Mode Flow
🔄 STDIO COMMUNICATION FLOW
┌─────────────────────────────────────────────────────────────┐
│ │
│ 📱 Client Process │
│ ┌─────────────────┐ │
│ │ 1. List Tools │ │
│ │ 2. Call Tool │ │
│ │ 3. Get Response │ │
│ └─────────────────┘ │
│ │ │
│ ▼ STDIO Pipes │
│ ┌─────────────────┐ │
│ │ 🖥️ MCP Server │ ◄─────┐ │
│ │ ├─ Parse JSON │ │ │
│ │ ├─ Route Tool │ │ │
│ │ └─ Send Result │ │ │
│ └─────────────────┘ │ │
│ │ │ │
│ ▼ │ │
│ ┌─────────────────┐ │ │
│ │ 🔄 Word Tool │ ──────┘ │
│ │ reverse("hi") │ │
│ │ returns "ih" │ │
│ └─────────────────┘ │
└─────────────────────────────────────────────────────────────┘
🌐 SSE Mode Flow
🌊 SERVER-SENT EVENTS FLOW
┌─────────────────────────────────────────────────────────────┐
│ │
│ 📡 SSE Client │
│ ┌─────────────────┐ │
│ │ 1. HTTP Connect │ │
│ │ 2. SSE Stream │ │
│ │ 3. JSON-RPC │ │
│ └─────────────────┘ │
│ │ │
│ ▼ HTTP/SSE │
│ ┌─────────────────┐ │
│ │ 🌐 HTTP Server │ │
│ │ ├─ Port 3000 │ │
│ │ ├─ /health │ ◄─────┐ │
│ │ └─ /sse │ │ │
│ └─────────────────┘ │ │
│ │ │ │
│ ▼ │ │
│ ┌─────────────────┐ │ │
│ │ 🔄 Word Tool │ ──────┘ │
│ │ reverse("mcp") │ │
│ │ returns "pcm" │ │
│ └─────────────────┘ │
└─────────────────────────────────────────────────────────────┘
🔒 Security & Quality
🛡️ SECURITY FEATURES
┌─────────────────────────────────────────────────────────────┐
│ │
│ ✅ Input Validation ✅ Type Safety │
│ ├─ Zod schema validation ├─ Full TypeScript coverage │
│ └─ Parameter sanitization └─ Compile-time checks │
│ │
│ ✅ Error Handling ✅ No Secrets │
│ ├─ Graceful failures ├─ Environment variables │
│ └─ Detailed error logs └─ Configuration files │
│ │
│ 🏆 QUALITY METRICS: │
│ ┌─────────────────────────────────────────────────────┐ │
│ │ 📏 All files < 500 lines │ │
│ │ 🔧 Modular architecture │ │
│ │ 📚 Comprehensive documentation │ │
│ │ 🧪 Test coverage for all features │ │
│ └─────────────────────────────────────────────────────┘ │
└─────────────────────────────────────────────────────────────┘
🚀 Command Reference
📋 COMPLETE SCRIPT REFERENCE
┌────────────────────┬─────────────────────────────────────────┐
│ Command │ Description │
├────────────────────┼─────────────────────────────────────────┤
│ npm run build │ 🔨 Compile TypeScript → JavaScript │
│ npm run start │ 🖥️ Start STDIO MCP server │
│ npm run start:sse │ 🌐 Start SSE MCP server (port 3000) │
│ npm run dev │ 🔥 STDIO server with hot reload │
│ npm run dev:sse │ 🌊 SSE server with hot reload │
│ npm run client │ 📱 Run STDIO test client │
│ npm run client:sse │ 📡 Run SSE test client │
│ npm run demo:stdio │ 🚀 Demo STDIO (server + client) │
│ npm run demo:sse │ 🌟 Demo SSE (server + client) │
│ npm run test │ 🧪 Run test suite │
│ npm run lint │ 🔍 Code quality check │
│ npm run typecheck │ ✅ TypeScript validation │
│ npm run test-demo │ 🎯 Complete demo test │
└────────────────────┴─────────────────────────────────────────┘
🎨 Demo in Action
🎬 LIVE DEMO EXAMPLE
┌─────────────────────────────────────────────────────────────┐
│ │
│ $ npm run demo:sse │
│ │
│ 🚀 Starting MCP SSE Client Tests │
│ │
│ 🏥 Server health: { status: "healthy" } │
│ ✅ Connected to MCP SSE server │
│ │
│ 📚 Available tools: │
│ - reverse_word: Reverses characters using SSE │
│ │
│ 🔄 Testing SSE word reversal with: "sse" │
│ ✨ Result: [SSE] Reversed word: "ess" (original: "sse") │
│ │
│ 🔄 Testing SSE word reversal with: "server" │
│ ✨ Result: [SSE] Reversed word: "revres" (orig: "server") │
│ │
│ ✅ All SSE tests completed! │
└─────────────────────────────────────────────────────────────┘
🌈 Technology Stack
🔧 TECH STACK RAINBOW
┌─────────────────────────────────────────────────────────────┐
│ │
│ 🟦 TypeScript ├─ Type safety & modern JS │
│ 🟩 Node.js ├─ Runtime environment │
│ 🟨 MCP SDK ├─ Model Context Protocol │
│ 🟪 Zod ├─ Schema validation │
│ 🟧 ESLint ├─ Code quality │
│ 🟥 npm ├─ Package management │
│ │
│ 📡 Transports: │
│ ├─ 🔌 STDIO # Standard input/output pipes │
│ └─ 🌐 SSE # Server-Sent Events over HTTP │
└─────────────────────────────────────────────────────────────┘
📝 License & Contributing
📄 MIT LICENSE
┌─────────────────────────────────────────────────────────────┐
│ │
│ 🎉 Feel free to use this demo as a foundation for your │
│ own MCP projects! │
│ │
│ 🤝 CONTRIBUTING: │
│ ├─ This is a demo showcasing MCP capabilities │
│ ├─ Extend it with additional tools and features │
│ ├─ Share your improvements with the community │
│ └─ Report issues and suggest enhancements │
│ │
│ 🌟 ENJOY BUILDING WITH MCP! 🌟 │
└─────────────────────────────────────────────────────────────┘
🎯 What's Next?
🚀 FUTURE ENHANCEMENTS
┌─────────────────────────────────────────────────────────────┐
│ │
│ 💡 Possible Extensions: │
│ ├─ 🔤 Text processing tools (uppercase, lowercase) │
│ ├─ 🧮 Math calculation tools │
│ ├─ 📅 Date/time utilities │
│ ├─ 🔐 Encoding/decoding tools │
│ ├─ 📊 Data validation tools │
│ └─ 🌍 Multi-language support │
│ │
│ 🎮 Try adding your own tools and see the magic happen! │
└─────────────────────────────────────────────────────────────┘
<div align="center">
🌟 Built with SPARC Methodology 🌟
Specification → Pseudocode → Architecture → Refinement → Completion
Happy coding! 🚀
</div>
推荐服务器
Baidu Map
百度地图核心API现已全面兼容MCP协议，是国内首家兼容MCP协议的地图服务商。
官方
精选
JavaScript
Playwright MCP Server
一个模型上下文协议服务器，它使大型语言模型能够通过结构化的可访问性快照与网页进行交互，而无需视觉模型或屏幕截图。
官方
精选
TypeScript
Magic Component Platform (MCP)
一个由人工智能驱动的工具，可以从自然语言描述生成现代化的用户界面组件，并与流行的集成开发环境（IDE）集成，从而简化用户界面开发流程。
官方
精选
本地
TypeScript
Audiense Insights MCP Server
通过模型上下文协议启用与 Audiense Insights 账户的交互，从而促进营销洞察和受众数据的提取和分析，包括人口统计信息、行为和影响者互动。
官方
精选
本地
TypeScript
VeyraX
一个单一的 MCP 工具，连接你所有喜爱的工具：Gmail、日历以及其他 40 多个工具。
官方
精选
本地
graphlit-mcp-server
模型上下文协议 (MCP) 服务器实现了 MCP 客户端与 Graphlit 服务之间的集成。 除了网络爬取之外，还可以将任何内容（从 Slack 到 Gmail 再到播客订阅源）导入到 Graphlit 项目中，然后从 MCP 客户端检索相关内容。
官方
精选
TypeScript
Kagi MCP Server
一个 MCP 服务器，集成了 Kagi 搜索功能和 Claude AI，使 Claude 能够在回答需要最新信息的问题时执行实时网络搜索。
官方
精选
Python
e2b-mcp-server
使用 MCP 通过 e2b 运行代码。
官方
精选
Neon MCP Server
用于与 Neon 管理 API 和数据库交互的 MCP 服务器
官方
精选
Exa MCP Server
模型上下文协议（MCP）服务器允许像 Claude 这样的 AI 助手使用 Exa AI 搜索 API 进行网络搜索。这种设置允许 AI 模型以安全和受控的方式获取实时的网络信息。
官方
精选