Axite MCP模板
一个轻量级的、类型安全的启动器，用于使用Next.js和Skybridge构建ChatGPT MCP应用程序。
该模板提供了一个简化的、可用于生产的基础，包括：
- Next.js应用路由器 结构
- 天桥 类型安全小部件的集成
- 更好的认证 （OAuth 2.1）
- 条纹 订阅支持（可选）
- 淋ORM 使用PostgreSQL
✨ 特性
- 🚀 类型安全端到端 -从后端工具到前端小部件的自动类型推断。
- 🔐 OAuth 2.1 -内置身份验证，用于ChatGPT/Claude集成。
- ⚡ Next.js原生 -小部件是标准的Next.js页面。
- 🔌 天桥供电 -使用打字挂钩(
useCallTool,useToolInfo)而不是原始的SDK调用。
🚀 快速开始
1.安装
pnpm install2.配置环境
复制 .env.example 到 .env 并填写您的详细信息。
3.运行开发服务器
pnpm dev您的MCP服务器正在运行 http://localhost:3000/mcp.
🛠️ 创建工具和小部件
1.定义工具和小部件(app/mcp/route.ts)
server.registerWidget(
"my_tool",
{ title: "My Tool", widgetPath: "/widgets/my-tool" },
{
description: "Does something cool",
inputSchema: z.object({ query: z.string() })
},
async ({ query }) => {
return createSuccessResponse("Done", { result: query });
}
);2.创建小部件页面(app/widgets/my-tool/page.tsx)
import MyWidget from "@/src/components/my-widget";
export default function MyToolPage() {
return ;
}3.构建小部件组件(src/components/my-widget/index.tsx)
"use client";
import { useToolInfo } from "@/src/mcp-ui-hooks";
export default function MyWidget() {
// Types are automatically inferred!
const { output } = useToolInfo();
if (!output) return
Loading...
;
return
Result: {output.structuredContent.result}
;
}📚 文档
app/mcp/route.ts-主服务器入口点src/mcp-ui-hooks.ts-类型定义和钩子lib/db/schema.ts-数据库架构
📄 许可证
麻省理工学院