起先
在我过去写的一篇文章中,我尝试在 VS Code 或 Claude for Desktop 中试用 MCP 服务器。
● 从 VS Code 设置添加 MCP 服务器,并尝试与 GitHub Copilot 代理模式一起使用(稳定版也可用)- Qiita
https://qiita.com/youtoy/items/adfeedeedf1309f194ce
●现在我尝试开始使用 Claude for Desktop 的 MCP(Claude 是免费计划) - Qiita
https://qiita.com/youtoy/items/3ef0af28b530f5c5709c
当时,我正在使用 Filesystem MCP Server,但这次我将尝试创建一个非常简单的自制 MCP 服务器,并从 VS Code 中使用它。
补充
补充剂,例如组合物
对于配置,我们将使用 VS Code 的标准功能设置您自己的 MCP 服务器,并在 GitHub Copilot 的代理模式下使用它。
Homebrew MCP 服务器也使用官方的 TypeScript SDK 来实现“工具”。 TypeScript 文件由 node 命令直接处理(* 使用 Node v23.6.0 或更高版本的功能)。
实现和过程应该是这样的,以便您可以确认使用 MCP 服务器的处理至少有效。
运作方式
另外,首先,以下视频展示了作此内容时的样子。
我们实现的测试是 “add two numbers plus another 10” (加两个数字加另外一个 10)。
在上面的视频中,我们有 3 次交互,在第二次交互中,我们选择下面的 “Allow in this session”(允许在此会话中)。
因此,在执行第三个作时,代理会执行该作,而不会询问用户是否要继续。
是什么让您决定尝试此内容?
我将写一个问题,让我想尝试一下这篇文章的内容。
在关注与 MCP 和 MCP 服务器相关的技术信息时,我看到了许多关于制作自己的 MCP 服务器的主题。
其中,我看到关于实现一个简单的 MCP 服务器并运行它的讨论,我想自己在这个方向上尝试一些东西。
- 为什么选择 MCP?
- 在 30 分钟内制作您自己的 MCP 服务器 - KITUNE 很好
- 如何试用实现简单的自制 MCP 服务器
- 使用 Azure Functions 创建 MCP 服务器!
- MCP介绍 - Speaker Deck
试用
我要试试看。
对于实现,请使用“官方页面(modelcontextprotocol/servers:模型上下文协议服务器页面)”中描述的“官方 Typescript SDK”。
在查看 SDK 页面上的 “安装” 和 “快速入门” 内容的同时,我们将继续进行准备和实施。
它将以使用已删除的部分内容的形式。
安装软件包
第一步是安装软件包 (@modelcontextprotocol/sdk)。
Copied!
npm install @modelcontextprotocol/sdk
法典
接下来,我们来谈谈我们在 TypeScript 中实现的代码。
示例代码
官方快速入门中显示的示例代码如下:
Copied!
import { McpServer, ResourceTemplate } from "@modelcontextprotocol/sdk/server/mcp.js";
import { StdioServerTransport } from "@modelcontextprotocol/sdk/server/stdio.js";
import { z } from "zod";
// Create an MCP server
const server = new McpServer({
name: "Demo",
version: "1.0.0"
});
// Add an addition tool
server.tool("add",
{ a: z.number(), b: z.number() },
async ({ a, b }) => ({
content: [{ type: "text", text: String(a + b) }]
})
);
// Add a dynamic greeting resource
server.resource(
"greeting",
new ResourceTemplate("greeting://{name}", { list: undefined }),
async (uri, { name }) => ({
contents: [{
uri: uri.href,
text: `Hello, ${name}!`
}]
})
);
// Start receiving messages on stdin and sending messages on stdout
const transport = new StdioServerTransport();
await server.connect(transport);
当我尝试各种方法时,似乎即使上述代码中的处理被大大减少,也可以在 “使用工具返回回复 ”的最低限度下完成。
修改后的代码
我删除了上述示例的内容,并使用了以下简单内容。
app.ts
Copied!
import { McpServer } from "@modelcontextprotocol/sdk/server/mcp.js";
import { StdioServerTransport } from "@modelcontextprotocol/sdk/server/stdio.js";
import { z } from "zod";
const server = new McpServer({
name: "Demo",
version: "1.0.0",
});
server.tool(
"add_test",
"与えられた数値の足し算をする(さらに10を足す)",
{ a: z.number(), b: z.number() },
async ({ a, b }) => ({
content: [{ type: "text", text: String(a + b + 10) }],
})
);
const transport = new StdioServerTransport();
await server.connect(transport);
如果你只是暂时移动它,这么多内容都没问题。
为了更容易从答案中确定使用上述 MCP 服务器处理的输出是否为要计算的处理部分获得,我尝试返回在输入值中再加 10 的结果。
此外,我在 “server.tool()” 的 “add_test” 之后添加了一句描述 MCP 服务器的句子。
VS Code 中的设置
在 VS Code 中,我们将继续进行 MCP 服务器相关的设置。
按照本文开头发布的上一篇文章中的相同步骤设置 MCP 服务器并在设置屏幕中启动服务器。
(* 还有另一种方法可以从命令面板启动服务器。
设置详细信息
本次活动内容如下。
Copied!
{
"mcp": {
"servers": {
"my-mcp-server": {
"command": "node",
"args": ["/【ファイルを置いたフォルダの絶対パス】/app.ts"]
}
}
}
}
在此设置中,node 命令配置为直接实现 TypeScript 文件。
正如我在下面的文章中所写的,我认为可以直接在 Node.js 上执行 TypeScript,因此我尝试将 “” 直接设置为 “” 的参数,如上所述。"command": "node"
app.ts
在 Node v23.6.0 上直接执行 TypeScript(默认无标志处理) - Qiita
https://qiita.com/youtoy/items/e7a1aeaea5918c48999b
我这次用的Node.js版本是 “v23.11.0”,它使用了支持直接执行 TypeScript 的版本。
执行结果
在 GitHub Copilot 的代理模式下,尝试使用上面实现的工具。 如果您无法在 VS Code 的最新稳定版本中选择 Agent mode(代理模式),请在设置中启用 Agent mode (代理模式) 功能。
本练习的结果如下。
当该工具运行时,会要求确认它是默认的,当允许时,将执行该过程。
以下是在更改了数字部分的提示符下运行流程的结果。
此外,试用内容如开头发布的视频所示。
跳过工具执行检查
另外,至于我一开始在视频发布部分写的内容,您可以选择以下设置,这样就不会每次都要求您确认工具的执行。
结论
这一次,我使用官方的 TypeScript SDK 实现了一个简单的自制 MCP 服务器。 我还在 VS Code 中使用了标准功能对其进行了设置,并在 VS Code 的 GitHub Copilot 代理模式下使用它。
我试图让使用该工具变得简单,所以我认为代码、设置、过程等要少得多。
由于这个项目的内容进行得没有任何问题,我想尝试在 MCP 服务器上实现的不同过程,并做一些更复杂的事情。
其他
这次尝试时,我在官方 VS Code 页面上看到了一个关于 MCP 服务器的页面,所以我将其作为备忘录发布。
●在 VS Code 中使用 MCP 服务器(预览版)
https://code.visualstudio.com/docs/copilot/chat/mcp-servers