MCP Server Testing Web App

🚀 MCP 服務器測試網絡應用

本網絡應用程序可讓用戶以 JSON 格式輸入 MCP 服務器配置，對其連接性和功能性進行驗證，並在用戶友好的界面上展示結果。它採用Node.js 後端和React 前端構建，部署於Vercel。

🚀 快速開始

此網絡應用程序允許用戶以 JSON 格式輸入 MCP 服務器配置，驗證其連接性和功能性，並在用戶友好的界面上顯示結果。你可以按照以下步驟開始使用：

1. 克隆倉庫並安裝依賴項。
2. 分別運行後端和前端服務。
3. 在前端輸入 JSON 配置進行 MCP 服務器測試。

✨ 主要特性

• 支持以 JSON 格式輸入 MCP 服務器配置。
• 可通過後端運行 MCP 服務器測試連接性。
• 以用戶友好的界面展示測試結果。
• 後臺使用 Node.js (Express) 實現。

📦 安裝指南

1️⃣ 克隆倉庫

git clone https://github.com/KartikeyM18/mcp-server-tester.git
cd mcp-server-tester

2️⃣ 安裝依賴項

cd 後端
npm install

cd 前端
npm install

3️⃣ 運行後端服務器

cd 後端
node src/index.js

默認情況下，後端在 http://localhost:3000 上運行。

4️⃣ 創建前端的 .env 文件

只需在前端文件夾中創建 .env 文件，並添加以下內容：

VITE_API_URL=http://localhost:3000/check-mcp

5️⃣ 運行前端

npm run dev  

🔧 技術細節

前端

• 接收用戶的 JSON 輸入。
• 將 MCP 服務器配置通過 API 請求發送到後端。
• 顯示後端運行的 MCP 服務器狀態。

後端

• 接收來自前端的 JSON 輸入。
• 使用 spawn(command, args) 執行 MCP 服務器測試命令。
• 通過 WebSocket 連接到 MCP 服務器以獲取可用工具。
• 將結果返回給前端。

💻 使用示例

基礎用法

以下是一個示例 JSON 輸入，可用於測試 MCP 服務器：

{
  "mcpServers": {
    "server-sequential-thinking": {
      "command": "npx",
      "args": [
        "-y",
        "@smithery/cli@latest",
        "run",
        "@smithery-ai/server-sequential-thinking",
        "--config",
        "{}"
      ]
    }
  }
}

將上述 JSON 輸入到前端界面，即可開始測試 MCP 服務器的連接性和功能性。