Next.js を使用したヘッドレス MCP の使用 (レジストリから)

設定可能なMCPレジストリで

デプロイされたURL

このアプリケーションは、 https://nextjs-mcp-use.vercel.appにデプロイされています。

Related MCP server: Vercel MCP

特徴

MCP レジストリ: 単一の JSON ファイルで複数の MCP サーバーを構成する
GitHub Actions : スケジュールされたワークフローと手動ワークフローを使用して API エンドポイントをテストおよび監視します
エラー処理: タイムアウトと接続失敗を適切に処理します
環境変数: 各MCPサーバーの環境変数を設定します

MCPレジストリ

MCPレジストリは、利用可能なすべてのMCPサーバーに関する情報を保存するJSON設定ファイルです。各サーバーは有効化または無効化でき、独自の環境変数を持つことができます。

レジストリはconfig/mcp-registry.jsonにあり、次の構造を持ちます。

{ "server-name": { "url": "http://localhost:3002/sse", "enabled": true, "env": { "API_KEY": "your-api-key" } }, "another-server": { "url": "https://example.com/sse", "enabled": false } }

使用法

このサンプルアプリは、任意の Next.js プロジェクト内のルートのグループに MCP サーバーをドロップインできるVercel MCP アダプターを使用します。

MCP TypeScript SDK ドキュメントに従って、ツール、プロンプト、リソースを使用してapp/[transport]/route.ts更新します。

APIエンドポイント

チャット API : /api/chat - ストリーミングチャットエンドポイント
完了 API : /api/completions - 非ストリーミングチャット完了エンドポイント

APIのテスト

提供されているテストスクリプトを使用して API エンドポイントをテストできます。

# Test the chat endpoint npm run test:chat -- --message "Your message here" # Test the completions endpoint npm run test:completions -- --message "Your message here" # Test with a custom URL npm run test:chat -- --url http://localhost:3000/api/chat --message "Your message here"

GitHubアクション

このプロジェクトには、APIエンドポイントのテストと監視のためのGitHub Actionsワークフローが含まれています。詳細については、.github/workflows/README.mdファイルをご覧ください。

Vercelで実行する場合の注意事項

SSEトランスポートを使用するには、 process.env.REDIS_URLの下のプロジェクトにRedisが接続されている必要があります。
効率的な実行のためにFluid Computeが有効になっていることを確認してください
Fluidコンピューティングを有効にした後、 app/route.tsを開き、Vercel ProまたはEnterpriseアカウントを使用している場合はmaxDuration 800に調整します。
Next.js MCP テンプレートをデプロイする