AI导哈

MCP服务器与客户端示例

一个展示如何使用TypeScript和@modelcontextprotocol/sdk创建和交互MCP服务器与客户端的项目，适用于开发工具链集成和自动化测试场景。

  • by sanketshinde3001
  • TypeScript
  • 本地部署
  • 更新于
在 GitHub 查看 sanketshinde3001/mcp

使用说明

MCP服务器和客户端示例（TypeScript）

该项目演示了使用TypeScript和 @modelcontextprotocol/sdk.

设置包括：

  1. my-mcp-greeter-server：提供问候相关工具、资源和提示的MCP服务器。
  2. my-mcp-client-script：一个简单的命令行客户端脚本，用于启动服务器、连接到服务器并以编程方式与其功能进行交互。

本例中客户端和服务器之间的通信使用 标准输入/输出 运输机制。

所遵循过程概述

该项目是按照以下主要阶段建造的：

  1. 服务器开发：创建MCP服务提供商。
  2. 客户端开发：创建一个脚本来使用服务器的服务。
  3. 测试与交互：运行客户端脚本，启动服务器并演示通信。
  4. （可选）集成：讨论如何将服务器与现有的MCP客户端（如VS Code扩展）集成。

先决条件

在开始之前，请确保已安装以下内容：

  • Node.js （建议使用v16或更高版本）
  • npm （通常包含在Node.js中）
  • 文本编辑器或IDE（如VS Code）
  • npx （通常包含在npm中）-适用于使用MCP Inspector进行测试。

第一阶段：构建MCP服务器(my-mcp-greeter-server)

  1. 项目设置:

    • 已创建目录 my-mcp-greeter-server.
    • 初始化了一个npm项目： npm init -y.
    • 已安装必要的依赖项： npm install @modelcontextprotocol/sdk zod.
    • 已安装的开发依赖关系： npm install -D typescript @types/node.
    • 已初始化TypeScript配置： npx tsc --init.
    • 已配置 tsconfig.json （设置 "module": "Node16", "target": "ES2022", "outDir": "./build", "rootDir": "./src"等等）。
    • 更新 package.json 包括 "type": "module" 并添加 build/start 脚本。
    • 已创建源文件 src/index.ts.

  2. 服务器实现(src/index.ts):

    • 导入所需模块(McpServer, StdioServerTransport, z).
    • 为服务器定义常量 name 和 version.
    • 被实例化 McpServer，传递名称、版本并声明其功能（工具、资源、提示）。
    • 定义工具(greet)：已使用 server.tool() 创建一个可由客户端调用的函数。包含描述，使用Zod定义输入参数(name, politeness)，并实现了返回个性化问候字符串的处理程序。
    • 定义资源(server-info)：已使用 server.resource() 以暴露静态数据。提供了一个唯一的URI(info://greeter/about)并实现了返回服务器名称和版本的处理程序。
    • 定义提示(suggest-greeting)：已使用 server.prompt() 创建可重用的交互模板。包含描述并实现了处理程序，以返回一组预定义的用户/助理消息来指导LLM交互。
    • 二手标准运输：即时 StdioServerTransport 作为一种沟通方式。
    • 连接：已呼叫 await server.connect(transport) 使服务器准备就绪。
    • 日志记录：已添加 console.error 用于执行期间可见性的语句，对于stdio传输尤其重要，其中stdout用于协议消息。
    • 活着：确保Node.js进程在连接后没有立即退出。

  3. 建筑与装修:

    • 跑 npm run build 将TypeScript编译为JavaScript build 目录。
    • 修复了与直接访问服务器版本相关的TypeScript错误，选择使用预定义的常量。

第二阶段：构建MCP客户端脚本(my-mcp-client-script)

  1. 项目设置:

    • 创建了一个单独的目录 my-mcp-client-script.
    • 初始化了一个npm项目： npm init -y.
    • 已安装必要的依赖项： npm install @modelcontextprotocol/sdk.
    • 已安装的开发依赖关系： npm install -D typescript @types/node.
    • 已初始化并配置 tsconfig.json 与服务器项目类似。
    • 更新 package.json 随着 "type": "module" 和 build/start 脚本。
    • 已创建源文件 src/client-script.ts.

  2. 客户端实施(src/client-script.ts):

    • 导入所需模块(Client, StdioClientTransport, path, url).
    • 已确定服务器路径：计算到的路径 服务器的 编译 index.js 文件（相对或绝对）。
    • 配置的标准传输：即时 StdioClientTransport，提供 command (node)以及 args （服务器脚本的路径）。 此配置是关键，因为客户端传输会启动服务器进程。
    • 即时客户端：创建了一个 Client 例如，给它一个身份，并声明它使用工具和资源的意图。
    • 连接：已呼叫 await client.connect(transport)，它启动了服务器进程，并通过其stdio流建立了MCP连接。
    • 与服务器交互:
      • 被称为 greet 工具使用 await client.callTool().
      • 阅读 server-info 资源利用 await client.readResource().
      • 拿走了 suggest-greeting 提示使用 await client.getPrompt().
    • 记录的结果：已使用 console.log 以显示从服务器接收到的响应。
    • 封闭连接：已使用 await client.close() 在一个 finally block以彻底关闭连接并终止服务器进程。

第三阶段：建设与运营

  1. 构建两个项目:

    • cd my-mcp-greeter-server && npm run build
    • cd ../my-mcp-client-script && npm run build

  2. 运行客户端:

    • cd my-mcp-client-script
    • npm run start （或 node build/client-script.js)
    • 观察到两个客户端的交错输出(console.log)以及服务器(console.error)，确认工具/资源/提示的成功沟通和执行。

角色说明

  • 服务器(GreeterServer):

    • 提供服务：显示特定功能（问候工具、服务器信息、提示模板）。
    • 被动监听器（在stdio中）：等待客户端通过其标准流连接。
    • 执行逻辑：当客户端请求时，运行与工具/资源/提示符关联的代码。
    • 发送结果：根据MCP规范格式化结果并将其发送回客户端。

  • 客户(client-script.ts):

    • 消费服务：使用服务器提供的功能。
    • 启动器（在stdio中）：启动服务器进程并建立连接。
    • 发送请求：决定调用哪个工具、读取哪个资源或获取哪个提示，并发送相应的MCP请求。
    • 接收结果：处理服务器发回的响应。
    • 控制流量：管理交互顺序并决定何时关闭连接。

交互式测试服务器

当客户端脚本测试程序化交互时，您可以使用MCP检查器单独测试服务器的功能：

# Make sure the server is NOT already running
# Replace /path/to/... with the actual absolute path
npx @modelcontextprotocol/inspector node /path/to/my-mcp-greeter-server/build/index.js

相关 MCP