MCP服务器测试主机

用于测试MCP服务器的Minimal Next.js (App Router)主机,支持代理MCP App JSON-RPC调用和资源加载。

  • by VibeJaro
  • HTML
  • 本地部署
  • 更新于
在 GitHub 查看 VibeJaro/MCP_Host

使用说明

MCP主机

用于测试MCP服务器的最小Next.js(App Router)主机。

环境变量

名称 必填 默认 描述
MCP_SERVER_URL ✅ n/a MCP服务器的基本URL(例如。 http://localhost:3001/mcp).
DASHBOARD_MCP_SERVER_URL ❌ https://dashboard-mcp.vercel.app/api/mcp 托管MCP仪表板服务器的基本URL。
MCP_RESOURCE_ID ❌ ui://hello_app_panel 要从MCP服务器加载的资源id/URI。
OPENAI_API_KEY ❌ n/a 此项目不需要。

本地开发

npm install
npm run dev

打开 http://localhost:3000.

API路线

  • GET /api/health → { ok: true }
  • POST /api/mcp/call-hello → calls hello_world 工具
  • GET /api/mcp/resource → 加载MCP资源
  • POST /api/mcp/app-bridge → 将MCP App JSON-RPC工具/资源调用代理到主服务器
  • POST /api/mcp/dashboard/app-bridge → 将MCP应用程序调用代理到仪表板服务器
  • POST /api/mcp/dashboard/custom/app-bridge → 将MCP应用程序调用代理到自定义仪表板服务器URL

测试流程

  1. 集 MCP_SERVER_URL 在您的环境中。
  2. 启动开发服务器(npm run dev).
  3. 打开聊天风格UI并单击 打开概述 调用 dashboard_mcp_hello.
  4. 使用 自定义MCP服务器URL 字段+切换以测试Vercel预览部署。
  5. 扩展 显示调试数据 在需要时检查原始MCP响应。

UI大小

主机布局现在允许更宽的仪表板(高达1100px),嵌入式MCP App iframe的目标是 更大的视图(最小高度560px,~70vh),以更好地适应大型仪表板。

MCP应用程序交互性

主机现在转发MCP App postMessage JSON-RPC请求(例如, tools/call)从 将iframe嵌入到配置的MCP服务器。这启用了以下按钮 更新状态 在 应用程序UI通过主机调用工具,而不是超时。

构建

npm run build
npm start

维塞尔

使用默认的Next.js框架设置进行部署(无自定义输出目录覆盖)。