Demo Ts MCP Client Server

🚀 MCP 基礎 Demo

本項目展示了運用模型上下文協議 (MCP) 實現的基礎客戶端 - 服務器交互。MCP 可讓 AI 模型（例如藉助 AI SDK 訪問的 Google Gemini/Vertex AI 等模型）安全地發現並利用由獨立服務器進程提供的外部工具或資源。

項目亮點

• 服務器作為 MCP 提供方，提供簡單計算工具。
• 客戶端通過 AI SDK 與 Google AI 模型交互，並連接 MCP 服務器，使 AI 在生成過程中能調用服務器工具，擴展其能力。

🚀 快速開始

先決條件

• Node.js（版本 >=23.0.0，如 package.json 中指定）
• npm（隨 Node.js 提供）
• Google AI (Gemini) API Key。可從 Google AI Studio 獲取（使用 Gemini 模型時需要）

設置步驟

1. 克隆倉庫

   git clone git@github.com:bertrandgressier/demo-ts-mcp-client-server.git
   cd demo-mcp-basic
   

2. 安裝依賴項

   npm install
   

3. 創建環境文件 複製示例環境文件 .env.example 為新文件 .env：

   cp .env.example .env
   

   編輯 .env 文件，添加實際的 API 密鑰和配置。所需的可選變量如下：

   # 必填項：用於 Google Studio 模型（Gemini）
   GOOGLE_API_KEY=YOUR_GOOGLE_API_KEY
   
   # 必填項：用於 Google Vertex AI 模型
   VERTEX_PROJECT_ID=YOUR_VERTEX_PROJECT_ID
   
   # 可選：未設置時默認為 'us-central1'
   # VERTEX_LOCATION=your-vertex-location
   
   # 可選：Vertex AI 服務賬戶密鑰文件的路徑。未設置時，默認為根目錄中的 'vertex-key.json'。
   # VERTEX_KEY_FILE=path/to/your/vertex-key.json
   

   請將 YOUR_GOOGLE_API_KEY 和 YOUR_VERTEX_PROJECT_ID 替換為您自己的值。

   ⚠️ 重要提示

   請勿將 .env 文件提交到版本控制系統。

可用腳本

• npm run build：將項目源代碼編譯為 JavaScript。
• npm start：運行編譯後的項目。
• npm run dev：以開發模式運行，更改代碼後自動重新加載。

📚 詳細文檔

項目結構

• src/：存放 TypeScript 源代碼。
  • client/：MCP 客戶端應用程序代碼。
  • server/：MCP 服務器應用程序代碼。
  • model.ts：處理 AI 模型初始化和環境變量加載。
• dist/：編譯後的 JavaScript 代碼（運行 npm run build 後生成）。
• .env：存儲環境變量（如 API 密鑰等） - 請勿提交此文件。
• package.json：項目元數據和依賴項信息。
• tsconfig.json：TypeScript 編譯器配置文件。

說明

此 Demo 展示瞭如何在 AI 應用程序中利用 MCP 協議集成外部工具。服務器提供基本數學運算功能，客戶端通過與 Google Gemini 交互調用這些服務。