MCP ts server client

MCP示例代理教程

一个模型上下文协议（MCP）服务器，为用户和待办事项提供工具、资源和提示。支持两者 标准 （当地）和 流式HTTP （云就绪）传输。本教程解释了项目结构、如何构建工具、资源和提示，以及如何与Cursor集成。

先决条件

• Node.js 18+
• npm或pnpm

快速开始

npm install
npm run dev          # Run the MCP server (Streamable HTTP on port 3000)
npm run inspect      # Test in MCP Inspector

______________________________________________________________________

项目结构

tc_mcp_III/
├── src/
│   ├── index.ts              # Entry point: Express + Streamable HTTP transport
│   ├── server.ts             # MCP server factory (createMCPServer)
│   ├── entities/
│   │   ├── user.entity.ts    # Zod schemas and types for users
│   │   └── todo.entity.ts    # Zod schemas and types for todos
│   ├── users/
│   │   └── userHandler.ts    # Business logic: create, fetch users
│   ├── tools/
│   │   └── users/
│   │       ├── createUserTool.ts   # MCP tool: create-user
│   │       └── fetchUsersTool.ts   # MCP tool: fetch-users
│   ├── resources/
│   │   ├── users/
│   │   │   └── usersResources.ts   # MCP resource: users (read-only)
│   │   └── todo/
│   │       ├── todoResources.ts   # MCP resources: todos, single-todo (template)
│   │       └── todoHandler.ts     # Fetches todos from dummyjson.com
│   └── prompts/
│       └── todos/
│           └── todosPrompts.ts    # MCP prompt: fetch-todo-item
├── users.json                # JSON "database" for users
├── .cursor/
│   └── mcp.json              # Cursor MCP configuration
├── package.json
└── tsconfig.json

层职责

______________________________________________________________________

传输：流式HTTP

服务器使用 流式HTTP 传输，使其适合云部署（例如GCP cloud Run）。每个HTTP请求都会得到一个新的MCP服务器实例（无状态模式）。

运作原理

1. Express应用程序正在监听 PORT （默认值3000）
2. 所有MCP流量都流向 /mcp 端点
3. 对于每个请求：创建服务器→ 注册工具/资源/提示→ 连接运输→ 处理→ close

// src/index.ts (simplified)
function getServer() {
    const server = createMCPServer();
    registerCreateUserTool(server);
    registerFetchUserTool(server);
    registerAllUsersResource(server);
    registerAllTodoResources(server);
    registerSingleTodoResource(server);
    registerFetchPrompt(server);
    return server;
}

app.all('/mcp', async (req, res) => {
    const server = getServer();
    const transport = new StreamableHTTPServerTransport();
    await server.connect(transport);
    await transport.handleRequest(req, res, req.body ?? {});
    res.on('close', () => {
        server.close();
        transport.close();
    });
});

______________________________________________________________________

服务器工厂(src/server.ts)

服务器是根据请求创建的，以支持无状态HTTP：

import { McpServer } from "@modelcontextprotocol/sdk/server/mcp.js";

export function createMCPServer() {
    return new McpServer(
        { name: 'emi_mcp_server', version: '1.0.0' },
        {
            capabilities: {
                tools: {},
                prompts: {},
                resources: {},
                tasks: {}
            }
        }
    );
}

______________________________________________________________________

注册模式

工具、资源和提示的使用 注册功能 接受服务器实例。这允许根据请求创建新服务器，并在使用前进行配置。

示例：获取用户工具

import type { McpServer } from '@modelcontextprotocol/sdk/server/mcp.js';

export function registerFetchUserTool(server: McpServer) {
    server.registerTool(
        'fetch-users',
        { title: '...', description: '...', inputSchema: fetchUserSchema },
        async (userSearch) => ({ content: [{ type: 'text', text: JSON.stringify(foundUsers) }] })
    );
}

______________________________________________________________________

资源

静态资源

资源模板

资源模板出现在 模板 MCP检查员的一部分。要阅读单个待办事项，请请求例如。 todos://5/single.

返回格式： { contents: [{ uri: string, text: string }] }

______________________________________________________________________

提示

提示是人工智能交互的可重用模板。在光标中，键入 / 在聊天中查看可用提示。

例子： /fetch-todo-item 随着 id: 1 → *“去获取一个基于1的待办事项”*

______________________________________________________________________

将服务器添加到游标

选项A：本地（通过mcp远程进行stdio）

如果在本地运行HTTP服务器，请使用 mcp-remote 代理：

{
  "mcpServers": {
    "tc_mcp_iii": {
      "command": "npx",
      "args": ["-y", "mcp-remote", "http://localhost:3000/mcp"],
      "cwd": "C:\\code\\MCP\\tc_mcp_III"
    }
  }
}

选项B：直接URL（如果Cursor支持）

{
  "mcpServers": {
    "tc_mcp_iii": {
      "url": "http://localhost:3000/mcp"
    }
  }
}

选项C：云部署

对于部署在Cloud Run或类似平台上的服务器：

{
  "mcpServers": {
    "tc_mcp_iii": {
      "command": "npx",
      "args": ["-y", "mcp-remote", "https://YOUR-SERVICE.run.app/mcp"]
    }
  }
}

______________________________________________________________________

MCP检验员测试

通过URL连接（流式HTTP）

1. 端子1 启动服务器：

   npm run dev

1. 2号航站楼 –启动检查器并连接到URL：

   npx @modelcontextprotocol/inspector --connect http://localhost:3000/mcp

1. 在检查器UI中，选择 可流式传输http 作为运输和进入 http://localhost:3000/mcp 如果提示。

通过stdio连接（传统）

这 npm run inspect 脚本将服务器作为子进程生成。对于Streamable HTTP测试，请使用上面的双终端方法。

______________________________________________________________________

可用工具

可用资源

可用提示

______________________________________________________________________

云部署（GCP云运行）

服务器已准备好进行云部署：

1. 构建和部署：

   gcloud run deploy tc-mcp-server --source .

1. 环境： 集 PORT （Cloud Run默认使用8080）。

1. 客户端配置： 将光标或检查器指向 https://YOUR-SERVICE.run.app/mcp.

1. 认证： 使用 gcloud run services proxy 对于本地客户，或OIDC/IAM用于生产。

看 在云端运行主机MCP服务器 了解详情。

______________________________________________________________________

故障排除

______________________________________________________________________

参考文献

• 模型上下文协议
• MCP TypeScript SDK
• 在云端运行主机MCP服务器
• 光标MCP文档