ARTICLE DETAIL

资讯详情

深耕网站建设与运营推广的一线实战洞察。

mcp-for-beginners 实战:构建并测试你的第一个 TypeScript MCP Server(MCP Inspector 完整指南)

mcp-for-beginners 实战:构建并测试你的第一个 TypeScript MCP Server(MCP Inspector 完整指南) 教程文档人工智能【免费下载链接】mcp-for-beginnersThis open-source curriculum introduces the fundamentals of Model Context Protocol (MCP) through real-world, cross-language examples in .NET, Java, TypeScript, JavaScript, Rust and Python. Designed for developers, it focuses on practical techniques for building modular, scalable, and secure AI workflows from session setup to service orchestration.项目地址https://gitcode.com/GitHub_Trending/mc/mcp-for-beginners点击查看免费下载本文基于 mcp-for-beginners 课程仓库中03-GettingStarted/01-first-server的 TypeScript 解决方案solution/typescript/README.md完整讲解如何安装依赖、构建并运行一个基于 stdio 传输的 MCP Server以及如何用 MCP Inspector 的浏览器界面与 CLI 模式对它进行验证。读完本文你将掌握npm run build一键构建、npm run inspector可视化测试以及npx modelcontextprotocol/inspector --cli纯命令行调试工具清单与调用工具的核心技能。一、示例概览一个最小的 TypeScript MCP Server 长什么样该解决方案是一个完整的 npm 工程位于仓库 solution/typescript 目录下核心文件只有三个文件作用src/index.ts服务器全部业务逻辑注册工具、资源与提示词并建立 stdio 传输package.json项目元信息、依赖与build/inspector脚本tsconfig.jsonTypeScript 编译配置输出目录为./build从源码src/index.ts可以看出这个服务器注册了 MCP 的三类核心原语Tool工具add接收两个数字a、b返回它们的和Resource资源模板file基于ResourceTemplate(file://{path})动态响应路径请求Prompt提示词review-code接收一段代码文本并组装成请审查这段代码的用户消息。服务器通过StdioServerTransport连接即从标准输入stdin读取 JSON-RPC 消息、向标准输出stdout写回响应——这是本地进程间通信的推荐方式。整个注册逻辑在源码 src/index.ts 中清晰可见例如add工具// Add an addition tool server.tool(add, { a: z.number(), b: z.number() }, async ({ a, b }) ({ content: [{ type: text, text: String(a b) }] }) );参数a、b使用 Zod 的z.number()声明类型MCP SDK 会自动将其转换为 JSON Schema 暴露给客户端这正是后面 Inspector 中看到inputSchema的来源。本课程前一课 03-GettingStarted/01-first-server/README.md 详细讲解了从零搭建该服务器的全部步骤创建工程、安装modelcontextprotocol/sdk与zod、配置tsconfig.json、编写代码本方案即是对应的完整可运行答案各语言版本见 solution/README.md。二、前置准备Node.js 与可选工具 uv开始之前请确认你的环境满足以下条件Node.js 与 npmMCP 的 TypeScript SDK、tsc编译器以及 Inspector 都是 npm 包Node.js 18 均可运行uv可选非必需官方 README 建议安装uv但明确说明并不是必须的。uv是一个极速的 Python 包与项目管理器本示例纯 TypeScript不使用 Python因此你完全可以跳过它仅当后续 Python 示例需要时再安装。三、安装依赖在解决方案目录仓库内路径为03-GettingStarted/01-first-server/solution/typescript下执行npm install这一步会依据 package.json 安装以下依赖运行时依赖modelcontextprotocol/sdk版本要求1.26.0、zod^3.24.2用于参数 Schema 校验、uuid^11.1.0等开发依赖typescript^5.3.3、types/node^20.11.24、types/uuid。从 package.json 的 scripts 配置可以看到两个关键命令scripts: { build: tsc node ./build/index.js, inspector: npx modelcontextprotocol/inspector node build/index.js }其中build脚本先执行tsc编译依据 tsconfig.json目标ES2022、模块体系Node16、源码目录src、输出目录build编译完成后直接以node启动服务器inspector脚本则是启动 MCP Inspector 并拉起服务器进程。四、构建并启动服务器执行npm run build该命令会调用tsc将 src/index.ts 编译到./build目录启动node ./build/index.js服务器随即通过 stdio 传输开始监听来自 stdin 的 MCP 请求。由于是 stdio 服务器它本身不会打印端口或日志到 stdoutstdout 必须留给协议消息看起来没有输出是正常现象。要真正验证它需要借助 MCP Inspector。五、用 MCP Inspector 在浏览器中测试服务器保持服务器运行另开一个终端执行npm run inspector它等价于直接运行npx modelcontextprotocol/inspector node build/index.js会启动一个带可视化界面的本地 Web 服务让你像使用Postman for MCP一样与服务器交互。连接成功后你可以列出工具并调用add在 Tools 面板选择add工具传入参数a 2、b 4结果应返回6测试资源模板进入 Resources 面板找到资源模板并调用填入一个名字后应返回包含该名字的问候文本。本解决方案源码中注册的是file://{path}模板见 src/index.ts会返回形如File, {path}!的文本课程练习版则使用greeting://{name}模板返回Hello, {name}!两种形态的测试思路完全一致——填入占位符参数并观察动态渲染结果。课程 01-first-server/README.md 展示了 Inspector 连接后的典型界面Inspector 的能力覆盖工具tools、资源resources、提示词prompts三类原语的发现与调用还会展示服务器的元数据、Schema 和实时响应是开发和调试 MCP Server 最直接的手段。更完整的调试技巧连接失败、工具不出现、参数报错等场景的排查清单可参考课程 13-mcp-inspector/README.md。六、CLI 模式测试更快、更适合脚本化你通过npm run inspector启动的 Inspector 本质上是一个 Node.js 应用而 Python 生态中的mcp dev只是它的一个包装。因此你可以绕开浏览器直接用 CLI 模式进行测试——官方 README 特别提示CLI 模式通常比浏览器模式快得多。6.1 列出工具清单npx modelcontextprotocol/inspector --cli node ./build/index.js --method tools/list该命令会向服务器发送tools/list请求输出所有已注册工具及其 JSON Schema预期结果如下{ tools: [ { name: add, description: Add two numbers, inputSchema: { type: object, properties: { a: { title: A, type: integer }, b: { title: B, type: integer } }, required: [ a, b ], title: addArguments } } ] }可以看到源码中z.number()声明的参数已被 SDK 自动翻译为标准的inputSchematype: object、两个integer属性、required: [a, b]这验证了Zod Schema → JSON Schema的底层机制对应源码 src/index.ts。6.2 调用工具npx modelcontextprotocol/inspector --cli node ./build/index.js --method tools/call --tool-name add --tool-arg a1 --tool-arg b2该命令向服务器发送tools/call请求调用add并传入a1、b2预期输出{ content: [ { type: text, text: 3 } ] }其中content数组携带了工具返回的文本结果3isError: false表示调用成功。这正是 MCP 协议中工具调用响应的标准结构也与上一节浏览器界面中运行add得到的界面结果一致。CLI 模式非常适合写入脚本、CI 或自动化冒烟测试每次执行都是独立的进程调用无需人工点击界面返回的 JSON 可以直接被jq等工具解析断言。七、源码级原理三个原语与一条传输线结合 src/index.ts可以归纳出这个示例的完整构成工具toolserver.tool(name, schema, handler)注册可被模型调用的函数。add的 handler 返回{ content: [{ type: text, text: String(a b) }] }与 CLI 调用响应的结构一一对应动态资源resource templateserver.resource(file, new ResourceTemplate(file://{path}, { list: undefined }), ...)注册资源模板。注意{ list: undefined }表示该资源不参与resources/list列举只能通过模板 URI 直接读取handler 接收(uri, { path })并返回带uri与text的contents数组提示词promptserver.prompt(review-code, { code: z.string() }, ...)注册一个提示词模板调用时把用户传入的code组装进系统给 LLM 的消息文本传输transportnew StdioServerTransport()await server.connect(transport)让服务器通过 stdin/stdout 与父进程通信这是本地 MCP Server 与 Client 通信的推荐方式天然具备进程隔离特性。此外package.json 中type: module使工程采用 ESM 模块体系配合tsconfig.json的module: Node16与moduleResolution: Node16确保编译产物能够被 Node.js 以 ESM 方式正确加载bin字段还预留了一个weather可执行入口指向./build/index.js方便后续以命令行方式分发该服务器。八、常见问题与排查要点结合本课程与 13-mcp-inspector/README.md 的实践几个高频问题值得注意现象排查方向Inspector 显示 Disconnected / 一直 Connecting确认node ./build/index.js能正常启动、依赖已安装、路径相对当前目录正确Tools 面板为空检查tools/list响应确认工具在启动期间完成注册、服务器未崩溃工具调用返回错误核对参数是否匹配inputSchema如add要求整数a、b关注错误码-32602 表示参数非法资源返回空内容确认 URI 与模板占位符填写正确服务器对资源路径有读取权限CLI 模式返回的错误信息与浏览器消息日志完全一致是快速定位上述问题的最省事路径。九、小结本文以 mcp-for-beginners 的 TypeScript 首个服务器方案为线索走完了 MCP Server 从安装依赖、编译构建到双模式测试的完整闭环npm install装齐依赖npm run build编译并启动npm run inspector打开可视化调试面板而npx modelcontextprotocol/inspector --cli ...则以纯命令行方式快速验证tools/list与tools/call。对照 src/index.ts 的源码你可以清楚地看到 Tool、Resource、Prompt 三个原语与 stdio 传输是如何被组织成一个最小可用的 MCP Server 的——这正是后续学习客户端接入02-client、带 LLM 的客户端03-llm-client以及更多高级主题的坚实基础。赞分享教程文档人工智能【免费下载链接】mcp-for-beginnersThis open-source curriculum introduces the fundamentals of Model Context Protocol (MCP) through real-world, cross-language examples in .NET, Java, TypeScript, JavaScript, Rust and Python. Designed for developers, it focuses on practical techniques for building modular, scalable, and secure AI workflows from session setup to service orchestration.项目地址https://gitcode.com/GitHub_Trending/mc/mcp-for-beginners点击查看免费下载相关推荐mcp-for-beginners 实战指南用 TypeScript 构建、运行并测试你的第一个 MCP Appmcp for beginners 实战指南用 TypeScript 构建、运行并测试你的第一个 MCP App MCP Apps 是 Model Conte教程文档人工智能mcp-for-beginners 实战用 TypeScript 编写并运行你的第一个 MCP 客户端mcp for beginners 实战用 TypeScript 编写并运行你的第一个 MCP 客户端 本篇文章基于开源课程 mcp for beginner教程文档人工智能在 mcp-for-beginners 中运行并测试第一个 .NET MCP 服务器dotnet restore 到 MCP Inspector 全流程实战在 mcp for beginners 中运行并测试第一个 .NET MCP 服务器dotnet restore 到 MCP Inspector 全流程实战教程文档人工智能创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
返回列表