Logo

菜单

发布于 2026-01-06 2 阅读
0

使用 TypeScript 构建可用于生产环境的 MCP 服务器

使用 TypeScript 构建可用于生产环境的 MCP 服务器

什么是模型上下文协议（MCP）？

模型上下文协议 (MCP) 是一个框架，它允许 Cursor 或 Claude 等 AI 助手与外部工具、API 和数据库进行交互。您可以将其视为一座桥梁，让您的 AI 助手能够在现实世界中实际执行各种操作：获取数据、更新记录、处理支付或管理身份验证。

使用 MCP 服务器，您可以：

  • 处理用户身份验证和会话
  • 数据库操作（查询、迁移、CRUD）
  • 管理计费流程（免费套餐、升级、订阅）
  • 连接到外部 API（电子邮件、第三方数据、集成）
  • 将多个工具捆绑到一个可供人工智能访问的服务器中

为什么要使用MCP入门套件？

从零开始构建MCP服务器意味着要设置以上所有内容——身份验证、数据库连接、计费、API、错误处理和部署管道。这涉及很多环节。

MCP入门套件通过以下方式简化了流程：

立即安装

  • 一条命令即可启动 MCP 服务器
  • 已预配置 Kinde 身份验证
  • 通过 Neon PostgreSQL 设置数据库
  • 内置计费系统
  • 多个现成的模板（博客、电子商务、CRM、待办事项）

生产就绪功能

  • 安全认证流程
  • 数据库迁移和模式管理
  • 错误处理和日志记录

  • 速率限制和安全标头

  • 开箱即用的测试设置

开发者体验

  • TypeScript 支持
  • 开发热重载
  • 光标AI集成
  • 已准备好部署的配置

你将建造什么

在本教程结束时，您将创建一个完整的 MCP 应用程序，其中包含：

  • 身份验证系统 → 用户登录、注册和会话管理
  • 数据库集成 → PostgreSQL，带自动模式设置
  • CRUD 操作 → 创建、读取、更新和删除功能
  • 计费系统 → 免费增值模式及升级流程
  • AI集成 → 无缝光标AI集成
  • 生产环境部署 → 可直接部署的应用程序

先决条件

开始之前，请确保您已准备好：

  • Node.js 18+（下载）
  • npm 或 yarn
  • Cursor IDE（下载）
  • Git
  • 具备 TypeScript 基础知识（有帮助但非必需）

搭建开发环境

步骤 1：安装 Node.js 和 npm

node --version
npm --version
Enter fullscreen mode Exit fullscreen mode

如果缺少，请从nodejs.org下载并安装。

步骤 2：安装 Cursor IDE

  • 访问cursor.sh
  • 下载并安装 Cursor
  • 注册免费账户

步骤三：创建开发帐户

您需要以下账户：

Neon数据库（免费版）

  • 访问neon.tech
  • 注册免费账户
  • 创建一个新数据库
  • 复制您的连接字符串

Kinde.com（免费版）

  • 访问kinde.com
  • 注册免费账户
  • 创建新应用程序
  • 请记下您的客户凭证

创建您的第一个 MCP 申请

步骤 1：生成您的申请

npx mcp-starter-kit
Enter fullscreen mode Exit fullscreen mode

你会看到一个交互式提示：

🚀 MCP Starter Kit
Create MCP applications with authentication, database, and billing

📝 What would you like to name your application? my-awesome-app
📋 Choose your template:
  1. blog      - Blog management system (posts, comments)
  2. ecommerce - E-commerce system (products, orders)
  3. crm       - Customer relationship management (contacts, deals, tasks)
  4. todo      - Simple todo management system

🎯 Enter your choice (1-4): 1
🚀 Creating my-awesome-app with blog template...
✅ Application created successfully!
Enter fullscreen mode Exit fullscreen mode

步骤二：安装依赖项

npm install
Enter fullscreen mode Exit fullscreen mode

步骤三：了解项目结构

生成的项目将具有以下结构：

my-awesome-app/
├── package.json              # Dependencies and scripts
├── tsconfig.json             # TypeScript configuration
├── .env.example              # Environment template
├── README.md                 # Project documentation
└── src/
    ├── app-config.ts         # Application configuration
    ├── universal-server.ts   # Main MCP server
    ├── setup-db.ts          # Database setup script
    ├── kinde-auth-server.ts  # Authentication server
    └── core/                 # Core MCP modules
        ├── auth/             # Authentication manager
        ├── database/         # Database manager
        ├── server/           # MCP server core
        └── tools/            # Tool factory
Enter fullscreen mode Exit fullscreen mode

主要文件简要说明：

  • universal-server.ts→ 您的主 MCP 服务器，用于处理所有 AI 交互
  • kinde-auth-server.ts→ 用户登录/注销的身份验证服务器
  • setup-db.ts→ 数据库模式创建和迁移脚本
  • app-config.ts→ 针对您的特定应用程序模板的配置
  • core/→ MCP 模块

使用 Kinde 配置身份验证

步骤 1：设置 Kinde 应用程序

  1. 登录您的 Kinde 控制面板
  2. 创建一个新应用程序（如果您还没有的话）
  3. 请配置以下设置：
  • 应用程序名称：您的 MCP 应用程序
  • 重定向网址：http://localhost:3000/callback
  • 注销网址：http://localhost:3000

步骤二：配置环境变量

cp .env.example .env
Enter fullscreen mode Exit fullscreen mode

编辑您的 .env 文件：

# Kinde Authentication
KINDE_ISSUER_URL=https://your-domain.kinde.com
KINDE_CLIENT_ID=your_client_id
KINDE_CLIENT_SECRET=your_client_secret
JWT_SECRET=super_secret
Enter fullscreen mode Exit fullscreen mode

使用 Neon 设置数据库

步骤 1：更新您的 .env 文件

将你从 Neon 控制台复制的连接字符串粘贴到你的.env文件中：

# Database Configuration
DATABASE_URL=postgresql://username:password@host:port/database
Enter fullscreen mode Exit fullscreen mode

您的完整.env文件应如下所示：

# Database Configuration
DATABASE_URL=postgresql://username:password@host:port/database

# Kinde Authentication
KINDE_ISSUER_URL=https://your-domain.kinde.com
KINDE_CLIENT_ID=your_client_id
KINDE_CLIENT_SECRET=your_client_secret

# JWT Configuration
JWT_SECRET=your_super_secret_jwt_key_here

# Server Configuration
NODE_ENV=development
PORT=3000
Enter fullscreen mode Exit fullscreen mode

步骤 2：初始化数据库模式

npm run setup-db
Enter fullscreen mode Exit fullscreen mode

此命令将：

  • 连接到您的 Neon 数据库
  • 创建所有必要的表格
  • 建立索引和关系

构建您的 MCP 服务器

步骤 1：启动服务器：

npm run dev
Enter fullscreen mode Exit fullscreen mode

步骤 2：启动身份验证服务器：

npm run auth-server
Enter fullscreen mode Exit fullscreen mode

访问http://localhost:3000以测试登录流程。

步骤 3：了解 MCP 工具

您的 MCP 服务器提供以下工具：

身份验证工具：

  • login→ 获取身份验证 URL
  • save_token→ 保存身份验证令牌
  • logout→ 注销当前用户
  • refresh_billing_status→ 查看账单状态

CRUD 工具（博客模板）：

  • create_post→ 创建新博客文章
  • list_posts→ 查看所有博客文章
  • get_post→ 获取特定博客文章
  • update_post→ 更新现有帖子
  • delete_post→ 删除博客文章
  • create_comment→ 添加评论到帖子
  • list_comments→ 列出帖子评论

第四步：与 Cursor AI 集成

创建或编辑~/.cursor/mcp.json：

{
  "mcpServers": {
    "my-awesome-app": {
      "command": "node",
      "args": ["dist/universal-server.js"],
      "cwd": "/path/to/your/my-awesome-app",
      "env": {
        "DATABASE_URL": "your_database_url",
        "KINDE_ISSUER_URL": "your_kinde_issuer_url",
        "KINDE_CLIENT_ID": "your_kinde_client_id",
        "KINDE_CLIENT_SECRET": "your_kinde_client_secret",
        "JWT_SECRET": "your_jwt_secret"
      }
    }
  }
}
Enter fullscreen mode Exit fullscreen mode

配置 MCP 设置后，重启 Cursor 以加载新配置。

步骤 5：测试 AI 集成

在 Cursor 中，您现在可以使用自然语言与 MCP 应用程序进行交互：

"Create a new blog post titled 'Getting Started with MCP' with content about building AI applications"
"List all my blog posts"
"Update the post with ID 1 to change the title to 'Advanced MCP Techniques'"
Enter fullscreen mode Exit fullscreen mode

了解计费系统

MCP入门套件包含一套全面的计费系统：

免费等级限制

每个模板都有可配置的免费额度限制：

博客模板：

  • 10 篇帖子（免费版）
  • 50 条评论（免费版）
  • 无限阅读

电子商务模板：

  • 5 款产品（免费版）
  • 10 个订单（免费档）
  • 无限客户

升级流程

  • 使用情况跟踪 → 自动跟踪免费套餐使用情况
  • 限制警告 → 接近限制时发出通知
  • 升级提示 → 无缝跳转至计费门户
  • 计划管理 → 查看当前计划和使用情况

计费集成

// Check billing status
const billingStatus = await checkBillingStatus(userId);

// Redirect to upgrade
if (billingStatus.needsUpgrade) {
  return redirectToBillingPortal(userId);
}
Enter fullscreen mode Exit fullscreen mode

可用模板深度解析

博客模板

非常适合内容创作者和作家：

实体：

  • 文章- 标题、内容、作者、发布日期
  • 评论- 文本、作者、帖子关系

特征：

  • 支持富文本内容
  • 评论审核
  • 作者管理
  • 出版计划

使用案例：

  • 个人博客
  • 公司博客
  • 文档网站
  • 新闻网站

电子商务模板

非常适合在线商店和市场：

实体：

  • 产品- 名称、描述、价格、库存
  • 订单- 客户、商品、总计、状态
  • 订单项目- 产品、数量、价格

特征：

  • 库存管理
  • 订单跟踪
  • 客户管理
  • 支付集成

使用案例：

  • 在线商店
  • 数字市场
  • 订阅服务
  • 产品目录

CRM模板

非常适合销售团队和企业：

实体：

  • 联系人- 姓名、电子邮件、公司、状态
  • 交易- 标题、价值、阶段、联系方式
  • 任务- 描述、截止日期、联系人

特征：

  • 领导管理
  • 销售渠道
  • 任务自动化
  • 联系人细分

使用案例：

  • 销售团队
  • 客户支持
  • 潜在客户开发
  • 业务拓展

待办事项模板

非常适合提高个人效率和任务管理：

实体：

  • 待办事项- 标题、描述、完成情况、截止日期

特征：

  • 任务优先级
  • 截止日期管理
  • 完成情况跟踪
  • 类别组织

使用案例：

  • 个人效率
  • 项目管理
  • 团队协调
  • 目标追踪

高级功能和自定义

自定义实体创建

您可以使用自定义实体扩展任何模板：

// Add a new entity to your template
const customEntity = {
  name: 'custom_entity',
  fields: {
    title: 'string',
    description: 'text',
    created_at: 'timestamp'
  },
  relationships: {
    user_id: 'users.id'
  }
};
Enter fullscreen mode Exit fullscreen mode

自定义 MCP 工具

根据您的特定需求创建自定义工具：

// Custom tool example
const customTool = {
  name: 'send_email',
  description: 'Send email to user',
  parameters: {
    to: 'string',
    subject: 'string',
    body: 'string'
  },
  handler: async (params) => {
    // Your custom logic here
    return { success: true };
  }
};
Enter fullscreen mode Exit fullscreen mode

API速率限制

配置MCP服务器的速率限制：

// Rate limiting configuration
const rateLimitConfig = {
  windowMs: 15 * 60 * 1000, // 15 minutes
  max: 100, // limit each IP to 100 requests per windowMs
  message: 'Too many requests from this IP'
};
Enter fullscreen mode Exit fullscreen mode

部署和生产注意事项

MCP 服务器本地运行后，下一步需要考虑如何以安全且适用于生产环境的方式进行部署。以下是需要重点关注的几个方面：

环境配置

开发环境和生产环境应该分开存放。

发展 （.env.local）：

NODE_ENV=development
DATABASE_URL=your_dev_database_url
KINDE_ISSUER_URL=your_dev_kinde_url
Enter fullscreen mode Exit fullscreen mode

生产 （.env）：

NODE_ENV=production
DATABASE_URL=your_prod_database_url
KINDE_ISSUER_URL=your_prod_kinde_url
Enter fullscreen mode Exit fullscreen mode

安全考量

上线生产环境时，请遵循以下最佳实践：

  1. 环境变量 → 切勿将密钥或 .env 文件提交到版本控制系统。
  2. HTTPS → 在生产环境中，始终通过 HTTPS 提供您的应用程序。
  3. CORS → 配置 CORS，仅允许来自您域名的请求。
  4. 速率限制 → 使用速率限制保护您的端点免受滥用。
  5. 输入验证 → 验证所有传入请求以防止注入攻击。

部署选项

托管 MCP 服务器的方式有多种。以下是三种常见方式：

1. Vercel（推荐）
Vercel 通过自动构建和扩展使部署变得容易。

# Install Vercel CLI
npm i -g vercel

# Deploy your application
vercel --prod
Enter fullscreen mode Exit fullscreen mode

2. Railway
提供了一个简单的 GitHub 集成：

# Connect your GitHub repository
# Railway will automatically build and deploy your app
Enter fullscreen mode Exit fullscreen mode

3. Docker
为了更好地控制应用程序，您可以使用 Docker 将其容器化：

FROM node:18-alpine
WORKDIR /app
COPY package*.json ./
RUN npm ci --only=production
COPY . .
RUN npm run build
EXPOSE 3000
CMD ["npm", "start"]
Enter fullscreen mode Exit fullscreen mode

你应该选择哪一个？

选项 优点 缺点
维塞尔 零配置、快速部署、免费套餐，非常适合 TypeScript 应用 对服务器环境的控制力较弱
铁路 轻松集成 GitHub，支持后台作业 免费版的功能比 Vercel 更有限。
Docker 完全控制，可在任何云提供商之间迁移 需要更多安装和维护工作。

对于大多数开发者而言，Vercel 是上线速度最快的方案。如果需要更高的灵活性或后台任务，Railway是个不错的选择。而对于企业级控制，Docker才是未来的发展方向。

常见问题排查

光标中未检测到 MCP 服务器

症状：

  • 光标无法识别您的 MCP 服务器
  • 工具不会出现在光标界面中。

解决方案：

  • 检查~/.cursor/mcp.json语法
  • 请确认环境变量已设置
  • 完全重启光标
  • 确保 MCP 服务器正在运行
  • 检查光标日志是否存在错误

身份验证问题

症状：

  • 登录重定向失败
  • 令牌未保存
  • 身份验证错误

解决方案：

  • 在 .env 文件中验证 Kinde 凭据
  • 在 Kindle 控制面板中检查重定向 URL
  • 确保认证服务器在端口 3000 上运行。
  • 清除浏览器 Cookie 并重试
  • 检查 JWT 密钥是否设置正确

数据库连接问题

症状：

  • 数据库连接错误
  • 模式创建失败
  • 查询超时

解决方案：

  • 验证 Neon 数据库 URL
  • 检查数据库权限
  • 运行npm run setup-db以创建架构
  • 测试连接npm run test-db
  • 检查网络连接

性能问题

症状：

  • 响应速度慢
  • 内存使用率高
  • 超时错误

解决方案：

  • 优化数据库查询
  • 添加数据库索引
  • 实现缓存
  • 使用连接池
  • 监控资源使用情况

最佳实践和技巧

开发工作流程

  • 使用版本控制 → 始终使用 Git 管理您的项目
  • 环境管理 → 使用不同的环境进行开发/测试/生产环境测试
  • 测试 → 为您的 MCP 工具编写测试
  • 文档 → 记录您的自定义工具和配置
  • 监控 → 设置日志记录和监控

安全最佳实践

  • 密钥管理 → 使用环境变量管理所有密钥
  • 输入验证 → 验证来自人工智能和用户的所有输入
  • 速率限制 → 实施速率限制以防止滥用
  • 身份验证 → 始终验证用户身份验证
  • HTTPS → 在生产环境中使用 HTTPS

性能优化

  • 数据库索引 → 为常用字段添加索引
  • 连接池 → 使用连接池管理数据库连接
  • 缓存 → 对频繁访问的数据实现缓存
  • 延迟加载 → 仅在需要时加载数据
  • 监控 → 监控性能指标

AI集成技巧

  • 清晰描述 → 为您的 MCP 工具编写清晰的描述
  • 错误处理 → 提供有意义的错误消息
  • 背景 → 请在回答中包含相关背景信息
  • 验证 → 处理前验证 AI 输入
  • 日志记录 → 记录所有 AI 交互以进行调试

结论与后续步骤

您刚刚使用入门套件，用 TypeScript 构建了一个可用于生产环境的 AI 原生 MCP 服务器。在此过程中，您添加了身份验证、数据库集成、计费功能，甚至还将其连接到了 Cursor AI。

有了这个基础，您现在可以为您的服务器添加自定义工具、新实体和其他集成，以满足您的使用需求。

准备好构建您自己的 MCP 应用程序了吗？运行：

npx mcp-starter-kit
Enter fullscreen mode Exit fullscreen mode

今天就开始尝试吧。

如果您觉得本指南对您有所帮助，请给予支持，查看MCP Starter Kit GitHub 仓库并给它点个赞⭐。

每一颗星都能帮助其他人发现这个项目，也激励我为社区创造更多资源。

文章来源：https://dev.to/sholajgede/build-a-product-ready-ai-native-mcp-server-in-typescript-2034
Lyria RealTime：开发...
恭喜 Runner H“AI 智能...