🚀 MCP客户端应用

这是一款专为AI大模型服务的MCP（模型上下文协议）客户端程序——MCPHOLDER，它能让手机具备类似Claude Desktop的功能。该程序可将Cloudflare上的云端服务整合起来，为AI大模型提供有力的外部支持。

✨ 主要特性

• AI对话页面：用户能自由选择不同的大模型进行对话，默认选用Claude-3 Sonnet 3.7。
• MCP服务页面：清晰展示当前可用的MCP服务及其状态，还提供添加新服务的入口。
• MCP服务测试页面：专门用于测试新的MCP服务连接，用户可输入服务名称、URL、端口等信息。

🔧 技术细节

• Flutter 3.x
• Dart 3.x
• font_awesome_flutter：用于图标展示。
• google_fonts：用于字体样式。

🚀 快速开始

1. 请修改lib/config目录下的openRouterApiKey，当前程序仅支持openrouter的Claude Sonnet 3.7。
2. 由于网络环境问题，我只能上传Flutter的lib库，因此以下安装方式可能不可用：
   1. 确保已安装Flutter环境。
   2. 克隆此仓库。
   3. 运行以下命令安装依赖：

flutter pub get

4. 运行应用：

flutter run

📚 详细文档

项目结构

lib/
  ├── main.dart              # 应用入口
  ├── screens/               # 页面
  │   ├── chat_screen.dart   # AI对话页面
  │   ├── services_screen.dart  # MCP服务页面
  │   └── test_service_screen.dart  # MCP服务测试页面
  ├── widgets/               # 可复用组件
  ├── models/                # 数据模型
  └── utils/                 # 工具函数

MCP协议

模型上下文协议（MCP）是一种协议，允许AI模型通过外部工具和API执行操作。这使得AI助手能够执行实际任务，如发送电子邮件、查询数据或控制应用程序。

更多关于MCP协议的信息，请访问 Cloudflare的MCP文档。

演示

视频链接

在测试服务页面，我们需要：

1. 填入服务名称：add
2. 填入Cloudflare的服务URL：https://remote-mcp.yunhaisui.workers.dev/sse
3. 端口无需填写
4. API秘钥：任意输入，但不能为空

然后点击“注册客户端获取ID”，成功后点击“测试连接”。此时会弹出一个认证的OAuth授权按钮，点击启动OAuth授权。在新弹出的WebView页面中点击“approve”。之后App会自动识别MCP中有几个tools。

这时回到MCP服务页面，可以看到新增了一个加法工具。在AI对话页面中输入一个简单的加法问题，Claude Sonnet会自动调用MCP服务。目前我使用的是openrouter服务，由于速度较慢，但最终仍能获得正确的结果。下周计划在Cloudflare上测试几个有趣好玩的MCP服务。