// app/api/[transport]/route.ts import { createMcpHandler } from "mcp-handler"; import { z } from "zod"; const handler = createMcpHandler( (server) => { server.tool( "roll_dice", "Rolls an N-sided die", { sides: z.number().int().min(2), }, async ({ sides }) => { const value = 1 + Math.floor(Math.random() * sides); return { content: [{ type: "text", text: `🎲 You rolled a ${value}!` }], }; } ); }, { // Optional server options }, { // Optional redis config redisUrl: process.env.REDIS_URL, basePath: "/api", // this needs to match where the [transport] is located. maxDuration: 60, verboseLogs: true, } ); export { handler as GET, handler as POST };

// app/dynamic/[p]/[transport]/route.ts import { createMcpHandler } from "mcp-handler"; import type { NextRequest } from "next/server"; import { z } from "zod"; const handler = async ( req: NextRequest, { params }: { params: Promise<{ p: string; transport: string }> } ) => { const { p, transport } = await params; return createMcpHandler( (server) => { server.tool( "roll_dice", "Rolls an N-sided die", { sides: z.number().int().min(2) }, async ({ sides }) => { const value = 1 + Math.floor(Math.random() * sides); return { content: [{ type: "text", text: `🎲 You rolled a ${value}!` }], }; } ); }, { capabilities: { tools: { roll_dice: { description: "Roll a dice", }, }, }, }, { redisUrl: process.env.REDIS_URL, basePath: `/dynamic/${p}`, verboseLogs: true, maxDuration: 60, } )(req); }; export { handler as GET, handler as POST, handler as DELETE };

// server/api/mcp/[transport].ts import { createMcpHandler } from "mcp-handler"; import { getHeader, defineEventHandler, fromWebHandler } from "h3"; import { z } from "zod"; const handler = createMcpHandler((server) => { server.tool( "roll_dice", "Rolls an N-sided die", { sides: z.number().int().min(2) }, async ({ sides }) => { const value = 1 + Math.floor(Math.random() * sides) return { content: [{ type: "text", text: `🎲 You rolled a ${value}!` }] } } ) }, { // Optional server options }); export default fromWebHandler(handler);

"remote-example": { "url": "http://localhost:3000/api/mcp", }

"remote-example": { "command": "npx", "args": [ "-y", "mcp-remote", "http://localhost:3000/api/mcp" // this is your app/api/[transport]/route.ts ] }

"remote-example": { "command": "npx", "args": [ "-y", "mcp-remote", "http://localhost:3000/api/mcp" // this is your app/api/[transport]/route.ts ] }

// app/components/YourComponent.tsx import { McpClient } from "@modelcontextprotocol/sdk/client"; const client = new McpClient({ // When using basePath, the SSE endpoint will be automatically derived transport: new SSEClientTransport("/api/mcp/mcp"), }); // Use the client to make requests const result = await client.request("yourMethod", { param: "value" });

interface Config { redisUrl?: string; // Redis connection URL for pub/sub basePath?: string; // Base path for MCP endpoints maxDuration?: number; // Maximum duration for SSE connections in seconds verboseLogs?: boolean; // Log debugging information }

// app/api/[transport]/route.ts import type { AuthInfo } from "@modelcontextprotocol/sdk/server/auth/types.js"; import { createMcpHandler, withMcpAuth } from "mcp-handler"; import { z } from "zod"; // Create your handler as normal const handler = createMcpHandler( (server) => { server.tool( "echo", "Echo a message", { message: z.string() }, async ({ message }, extra) => { // Access auth info in your tools via extra.authInfo return { content: [ { type: "text", text: `Echo: ${message}${  extra.authInfo?.token  ? ` for user ${extra.authInfo.clientId}`  : ""  }`, }, ], }; } ); }, { // Optional server options } ); // Wrap your handler with authorization const verifyToken = async ( req: Request, bearerToken?: string ): Promise<AuthInfo | undefined> => { if (!bearerToken) return undefined; // Replace this example with actual token verification logic // Return an AuthInfo object if verification succeeds // Otherwise, return undefined const isValid = bearerToken.startsWith("__TEST_VALUE__"); if (!isValid) return undefined; return { token: bearerToken, scopes: ["read:stuff"], // Add relevant scopes clientId: "user123", // Add user/client identifier extra: { // Optional extra information userId: "123", }, }; }; // Make authorization required const authHandler = withMcpAuth(handler, verifyToken, { required: true, // Make auth required for all requests requiredScopes: ["read:stuff"], // Optional: Require specific scopes resourceMetadataPath: "/.well-known/oauth-protected-resource", // Optional: Custom metadata path }); export { authHandler as GET, authHandler as POST };

import { protectedResourceHandler, metadataCorsOptionsRequestHandler, } from "mcp-handler"; const handler = protectedResourceHandler({ // Specify the Issuer URL of the associated Authorization Server authServerUrls: ["https://auth-server.com"], }); const corsHandler = metadataCorsOptionsRequestHandler() export { handler as GET, corsHandler as OPTIONS };