使用说明
自制的Model Context Protocol (MCP) 客户端和服务器
此存储库包含:Model Context Protocol (MCP)中描述的场景,使用下列步骤创建明细表,以便在概念设计中分析体量的周长。Anthropic的,之Claude通过与模型的交互MCP中描述的场景,使用以下步骤创建明细表,以便在概念设计中分析体量的体积。
概要
Model Context Protocol (MCP)单击功能区上AI这是连接助手和各种数据源的开放标准。在本项目中MCP中描述的场景,使用下列步骤创建明细表,以便在概念设计中分析体量的周长。
主要功能
-
MCP服务器:
- Express.js使用RESTful API服务器
- Anthropic的,之API联合AI处理引擎
- 消息传递和上下文管理功能
-
WebSocket支持:
- 实时流响应
- 双向交互
- 基于事件的异步通信
-
MCP客户机:
- HTTP打开WebSocket支持两者的集成客户机
- 简单易用API
- 支持多种通信方式
-
演示应用程序:
- HTTP通信基本ー
- WebSocket流式演示
- 交互式聊天控制台
技术栈
- 后端:Node.js、Express、WebSocket(ws)
- 前端:TypeScript、Axios
- AI連携:API
- 其他: dotenv(环境变数管理),TypeScript(型安全な开発)
项目结构
mcp-client-server/
├── client/ # MCPクライアント実装
│ ├── http-client.ts # HTTP通信クライアント
│ ├── ws-client.ts # WebSocket通信クライアント
│ ├── mcp-client.ts # 統合クライアント
│ ├── types.ts # 型定義
│ └── index.ts # エントリーポイント
├── server/ # MCPサーバー実装
│ ├── controllers/ # APIコントローラー
│ ├── routes/ # APIルート定義
│ ├── services/ # MCPサービス
│ ├── websocket/ # WebSocketサポート
│ ├── types.ts # 型定義
│ └── index.ts # サーバーエントリーポイント
├── examples/ # サンプルアプリケーション
│ ├── http-demo.ts # HTTPデモ
│ ├── websocket-demo.ts # WebSocketデモ
│ └── chat-demo.ts # チャットデモ
├── MCP_DOCUMENTATION.md # MCPに関する詳細資料
├── dist/ # ビルド出力ディレクトリ
└── .env # 環境変数設定
设置方法
前提条件
- Node.js 14以上
- Anthropic API Key (Claude API),模板名称将采用不同的格式
安装说明
-
克隆或下载存储库
-
安装依赖关系
npm install
- 设置环境变量文件
# .envファイルを作成し、以下の内容を設定
PORT=3000
HOST=localhost
ANTHROPIC_API_KEY=your_anthropic_api_key_here
MODEL_NAME=claude-3-opus-20240229
MAX_TOKENS=1000
使用方法
启动服务器
npm run start:server
默认情况下,服务器http://localhost:3000中所述修改相应参数的值。 WebSocket服务器也同时ws://localhost:3000 中所述修改相应参数的值。
运行演示应用程序
1. HTTP执行演示
确保服务器已启动,然后运行。
npm run demo:http
这个演示HTTP API来修改标记元素的显示属性MCP与服务器通信,并执行以下操作:
- 服务器健康检查
- 发送简单提示并查看响应
- 分析完整消息请求的发送和响应
2. WebSocket执行流式演示
npm run demo:ws
这个演示WebSocket使用演示:
- WebSocket建立连接
- 发送简单提示
- 接收实时流响应
- 查看流的进度
3.运行交互式聊天演示
npm run demo:chat
在命令行上实时MCP交互演示:
- 「exit」继续对话直到输入
- WebSocket使用流响应
- 考虑到会话历史记录的保持和上下文的应答
API引用
HTTP API
|端点|方法|说明|
|-------------|--------|------|
| /api/health | GET | 服务器的健康检查
| /api/message | POST | 完整MCP发送消息
| /api/prompt | POST | 发送简单的文本提示
WebSocket API
WebSocket端点: ws://localhost:3000
客户端到服务器的消息类型
message-完整MCP发送消息prompt-发送简单的文本提示stream-请求流响应
从服务器到客户端的事件类型
connection-连接状态通知message_response-响应消息prompt_response-响应提示stream_start-流开始通知stream_chunk-流数据块stream_end-流结束通知error-错误通知
程序示例
客户机API使用示例
import { createMCPClient, createPromptRequest, MCPRole } from './client';
// クライアントの作成
const client = createMCPClient({
apiBaseUrl: 'http://localhost:3000',
wsBaseUrl: 'ws://localhost:3000'
});
// HTTP APIを使用した例
async function httpExample() {
// サーバーの状態確認
const health = await client.healthCheck();
console.log('サーバー状態:', health.status);
// シンプルなプロンプト送信
const response = await client.sendPrompt('AIの未来について教えてください');
console.log('応答:', response.response);
}
// WebSocketを使用した例
async function wsExample() {
// WebSocket接続
await client.connectWebSocket();
// イベントリスナーの登録
client.on('prompt_response', (data) => {
console.log('応答:', data.response);
});
// プロンプトの送信
client.sendWebSocketPrompt('量子コンピューティングの可能性は?');
// ストリーミングでのリクエスト
client.on('stream_chunk', (chunk) => {
// リアルタイムでチャンクを処理
process.stdout.write(chunk.content[0].text);
});
// ストリーミングリクエストの送信
client.sendStreamRequest({
messages: [{
role: MCPRole.USER,
content: [{ type: 'text', text: 'AIと人間の協調について詩を書いてください' }]
}],
model: 'claude-3-opus-20240229'
});
}
扩展和贡献
该项目提供了基本实现,但可以进行以下扩展:
- 追加多模式功能(图像处理等)
- 会话历史记录持久化
- 增强的认证功能
- 实现用户界面
- 更高级的错误处理
关连数据
详细的技术资料 MCP_DOCUMENTATION.md 来修改标记元素的显示属性。本文档包含以下信息:
- MCPの概念と原理
- 体系结构详细信息
- 安装模式
- 最佳实践
- 性能优化提示
许可证
麻省理工学院
注意事项
- 这个项目是为了教育和研究而提供的
- 在生产环境中使用时,请加强安全性和错误处理等
- API请妥善管理机密信息,如密钥
- Anthropic API使用条款