(目錄)

引言

上一篇《在Cline上調用MCP服務之MCP實踐篇》我們講到如何調用MCP服務,這次我們就來自己寫一個MCP服務。

在動手自己編寫MCP Server之前建議還是先認真看一遍MCP官網的介紹。 image.png

參考官方教程,我們計劃編寫一個名為“Echo”的MCP Server作為我們的MCP Server Hello world。

一、檢查環境並初始化項目

首先我們要檢查環境。對於本教程,您需要 Node.js 版本 16 或更高版本。

node --version
npm --version

現在,讓我們創建並設置我們的項目:

# Window 的命令如下
# Create a new directory for our project
md echo
cd echo

# Initialize a new npm project
npm init -y

# Install dependencies
npm install @modelcontextprotocol/sdk zod
npm install -D @types/node typescript

# Create our files
md src
new-item src\index.ts

image.png 繼續敲命令。 image.png 此時看一眼文件目錄。 image.png 看看接下來我都遇到了什麼。 image.png 換到powershell執行,OK了。此時index.ts文件為空。 image.png 更新您的 package.json 以添加 type: “module” 和構建腳本:

{
  "name": "echo",
  "version": "1.0.0",
  "main": "index.js",
  "scripts": {
    "build": "tsc && chmod 755 build/index.js",
	"prepare": "npm run build",
    "dev": "tsc --watch",
    "start": "node build/index.js",
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "description": "",
  "dependencies": {
    "@modelcontextprotocol/sdk": "^1.11.1",
    "zod": "^3.24.4"
  },
  "devDependencies": {
    "@types/node": "^22.15.17",
    "typescript": "^5.8.3"
  },

  "type": "module",
  "bin": {
    "echo": "./build/index.js"
  },
  "files": [
    "build"
  ]
}

在項目的根目錄中創建一個 tsconfig.json:

{
  "compilerOptions": {
    "target": "ES2022",
    "module": "Node16",
    "moduleResolution": "Node16",
    "outDir": "./build",
    "rootDir": "./src",
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true
  },
  "include": ["src/**/*"],
  "exclude": ["node_modules"]
}

二、構建MCP服務器

現在讓我們開始構建您的服務器。 在src/index.ts文件導入包並設置server實例。

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: "Echo",
  version: "1.0.0"
});

server.tool(
  "echo",
  { message: z.string() },
  async ({ message }) => ({
    content: [{ type: "text", text: `Tool echo: ${message}` }]
  })
);

server.prompt(
  "echo",
  { message: z.string() },
  ({ message }) => ({
    messages: [{
      role: "user",
      content: {
        type: "text",
        text: `Please process this message: ${message}`
      }
    }]
  })
);

最後,實現 main 函數來運行服務器:

async function main() {
  const transport = new StdioServerTransport();
  await server.connect(transport);
  console.error("echo MCP Server running on stdio");
}

main().catch((error) => {
  console.error("Fatal error in main():", error);
  process.exit(1);
});

確保運行 npm run build 來構建您的服務器!這是讓您的服務器連接非常重要的步驟。

但是提示這個玩意。也是,chomd 是屬於Linux下的命令。 image.png 嘗試換一下命令,並可以手動賦予編譯文件權限(其實不操作問題也不大)。

{
  "name": "echo",
  "version": "1.0.0",
  "main": "index.js",
  "scripts": {
    "build": "tsc",
	"prepare": "npm run build",
    "dev": "tsc --watch",
    "start": "node build/index.js",
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "description": "",
  "dependencies": {
    "@modelcontextprotocol/sdk": "^1.11.1",
    "zod": "^3.24.4"
  },
  "devDependencies": {
    "@types/node": "^22.15.17",
    "typescript": "^5.8.3"
  },

  "type": "module",
  "bin": {
    "echo": "./build/index.js"
  },
  "files": [
    "build"
  ]
}

於是build成功啦。 image.png

三、驗證效果

我們編寫了MCP server此時需要一個MCP client 來支持調用和驗證。於是我們剛好使用上一篇提的Cline插件來驗證,我們發現綠燈亮起來了。

image.png 趁熱打鐵,我們問個問題試一下: image.png image.png 至此,第一個MCP Server之Hello world的簡易demo結束了。 最後,關注一下官方目前提供的SDK語言支持哈。下一篇我們計劃嘗試來搞一個MCP Clients哈,拜了個拜,感謝品閲。