关于 Mcp Client
Mcp Client 是一个 Angular 和 TypeScript 编写的 MCP 客户端，用于连接 ApiLogicServer 执行，并集成 Claude.ai。它在网页界面中提供服务器发现、工具执行、模式实体 CRUD、筛选和实时操作日志。
主要功能
- 01发现并连接 MCP 服务
- 02通过参数替换执行工具
- 03对模式实体执行 CRUD 操作
- 04使用 JSON-API 格式筛选数据
- 05查看实时操作日志
- 06跟踪错误和状态
适用场景
- 01连接本地 MCP 服务
- 02对模式数据执行工具
- 03筛选客户、产品或订单记录
- 04监控操作结果和错误
MCP 相关
该 Angular 客户端可发现并连接 MCP 服务，然后执行其工具。README 提到本地服务地址为 localhost:5656。
配置
本地服务的配置在各客户端中通用，复制后粘贴到客户端的 MCP 配置文件即可。
我们还没有获取到这个服务的安装包或远程地址，请按项目 README 中的说明安装。
工具
本地服务需要在你的电脑上运行后才能读取工具，维护者暂未提供工具列表。
详细介绍
// ===== 设置说明 ===== /* 设置说明：
-
创建一个新的 Angular 项目： ng new mcp-angular-client --routing=false --style=css
-
用上面的代码替换生成的文件
-
将配置文件复制到 assets 目录：
- src/assets/mcp_server_discovery.json
- src/assets/mcp_tool_context.json
-
安装依赖： npm install
-
启动开发服务器： ng serve
-
确保 MCP 服务正在 localhost:5656 上运行
-
通过 http://localhost:4200 访问应用
功能：
✅ 服务发现与连接管理
✅ 使用参数替换执行工具
✅ 对所有架构实体执行完整的 CRUD 操作
✅ 使用 JSON-API 格式进行高级筛选
✅ 实时操作日志
✅ 响应式 UI 设计
✅ 错误处理与状态跟踪
✅ CORS 代理配置
使用示例：
-
连接到 MCP 服务：
- 点击“服务器状态”部分中该服务旁边的“连接”
-
执行工具：
- 使用“可用工具”部分中的“执行”按钮
-
使用筛选条件加载数据：
- “高信用额度客户”会加载 credit_limit > 5000 的客户
- “高价产品”会加载 unit_price > 100 的产品
- “近期订单”会加载 2024 年的订单
-
发送电子邮件：
- 点击任意客户旁边的“发送电子邮件”，即可触发电子邮件工具
-
监控操作：
- 在“操作日志”中查看所有操作及其状态
架构：
- MCPDiscoveryService：处理服务发现与连接
- MCPToolsService：使用参数替换执行工具
- DataService：为所有实体提供经过筛选的数据访问
- 响应式 UI：使用 observables 实现实时更新
- 类型安全：为所有数据模型提供完整的 TypeScript 接口
该框架可充分扩展，已做好投入生产使用的准备！ */
评论
一个开放协议，规定了 AI 应用如何以统一方式连接外部工具与数据源。客户端负责与模型对话，MCP 服务负责提供工具、资源和提示模板，两者通过标准消息通信，同一个服务可以被不同客户端复用。