Skip to main content
Glama

MCPフレームワーク

モデル コンテキスト プロトコル (MCP) サーバーを構築するための TypeScript フレームワーク。

オリジナルからの変更点

このフォーク (@ronangrant/mcp-framework) には、次の改善が含まれています。

  • 互換性と信頼性を向上させるために、ファイルベースのログ記録をコンソールのみのログ記録に置き換えました。

  • ログのファイルシステムへの依存をなくし、ENOENT エラーを排除しました

  • 同じインターフェースを維持しながら、ログの実装を簡素化

  • すべてのログが console.error() 経由で stderr に出力されるようになりました

Related MCP server: MCP Server Starter

インストール

npm install @ronangrant/mcp-framework

使用法

新しい MCP サーバーを作成します。

import { MCPServer } from '@ronangrant/mcp-framework'; const server = new MCPServer({ name: "my-server", version: "1.0.0" }); await server.start();

特徴

  • MCP サーバーを作成するための使いやすい API

  • ツール、プロンプト、リソースの組み込みサポート

  • コンソール出力を備えた簡素化されたログシステム

  • 完全なTypeScriptサポート

  • 柔軟な輸送オプション

ライセンス

マサチューセッツ工科大学

MCP-Framework は、TypeScript でモデル コンテキスト プロトコル (MCP) サーバーをエレガントに構築するためのフレームワークです。

MCPフレームワークは、ツール、リソース、プロンプトをディレクトリベースで自動検出する機能を備え、すぐに使えるアーキテクチャを提供します。強力なMCP抽象化機能を使用して、ツール、リソース、プロンプトを洗練された方法で定義できます。CLIを使えば、独自のMCPサーバーを簡単に構築できます。

特徴

  • 🛠️ ツール、リソース、プロンプトの自動検出と読み込み

  • 複数のトランスポートのサポート (stdio、SSE)

  • 完全な型安全性を備えた TypeScript ファースト開発

  • 公式MCP SDKをベースに構築

  • ツール、プロンプト、リソース用の使いやすい基本クラス

  • SSEエンドポイントのすぐに使える認証

完全なドキュメントはこちらでご覧ください

mcp-framework でリポジトリを作成する

CLI の使用 (推奨)

# Install the framework globally npm install -g mcp-framework # Create a new MCP server project mcp create my-mcp-server # Navigate to your project cd my-mcp-server # Your server is ready to use!

CLI の使用法

このフレームワークは、MCP サーバー プロジェクトを管理するための強力な CLI を提供します。

プロジェクトの作成

# Create a new project mcp create <your project name here>

ツールの追加

# Add a new tool mcp add tool price-fetcher

プロンプトの追加

# Add a new prompt mcp add prompt price-analysis

リソースの追加

# Add a new prompt mcp add resource market-data

開発ワークフロー

  1. プロジェクトを作成します。

mcp create my-mcp-server cd my-mcp-server
  1. 必要に応じてツールを追加します。

    mcp add tool data-fetcher mcp add tool data-processor mcp add tool report-generator
  2. 建てる:

    npm run build
  3. MCP クライアントに追加 (Claude Desktop の例については以下を参照してください)

Claude Desktopでの使用

地域開発

この構成を Claude Desktop 構成ファイルに追加します。

MacOS : `~/Library/Application Support/Claude/claude_desktop_config.json` Windows : `%APPDATA%/Claude/claude_desktop_config.json`

{ "mcpServers": { "${projectName}": { "command": "node", "args":["/absolute/path/to/${projectName}/dist/index.js"] } } }

公開後

この構成を Claude Desktop 構成ファイルに追加します。

MacOS : `~/Library/Application Support/Claude/claude_desktop_config.json` Windows : `%APPDATA%/Claude/claude_desktop_config.json`

{ "mcpServers": { "${projectName}": { "command": "npx", "args": ["${projectName}"] } } }

構築とテスト

  1. ツールに変更を加える

  2. `npm run build` を実行してコンパイルします

  3. サーバーは起動時にツールを自動的に読み込みます

クイックスタート

ツールの作成

import { MCPTool } from "mcp-framework"; import { z } from "zod"; interface ExampleInput { message: string; } class ExampleTool extends MCPTool<ExampleInput> { name = "example_tool"; description = "An example tool that processes messages"; schema = { message: { type: z.string(), description: "Message to process", }, }; async execute(input: ExampleInput) { return `Processed: ${input.message}`; } } export default ExampleTool;

サーバーの設定

import { MCPServer } from "mcp-framework"; const server = new MCPServer(); // OR (mutually exclusive!) with SSE transport const server = new MCPServer({ transport: { type: "sse", options: { port: 8080 // Optional (default: 8080) } } }); // Start the server await server.start();

トランスポート構成

stdio トランスポート (デフォルト)

トランスポート構成が指定されていない場合は、デフォルトで stdio トランスポートが使用されます。

const server = new MCPServer(); // or explicitly: const server = new MCPServer({ transport: { type: "stdio" } });

SSEトランスポート

Server-Sent Events (SSE) トランスポートを使用するには:

const server = new MCPServer({ transport: { type: "sse", options: { port: 8080, // Optional (default: 8080) endpoint: "/sse", // Optional (default: "/sse") messageEndpoint: "/messages", // Optional (default: "/messages") cors: { allowOrigin: "*", // Optional (default: "*") allowMethods: "GET, POST, OPTIONS", // Optional (default: "GET, POST, OPTIONS") allowHeaders: "Content-Type, Authorization, x-api-key", // Optional (default: "Content-Type, Authorization, x-api-key") exposeHeaders: "Content-Type, Authorization, x-api-key", // Optional (default: "Content-Type, Authorization, x-api-key") maxAge: "86400" // Optional (default: "86400") } } } });

CORS設定

SSEトランスポートは柔軟なCORS設定をサポートしています。デフォルトでは、開発環境に適した許容設定が使用されます。本番環境では、セキュリティ要件に応じてCORSを設定する必要があります。

const server = new MCPServer({ transport: { type: "sse", options: { // Restrict to specific origin cors: { allowOrigin: "https://myapp.com", allowMethods: "GET, POST", allowHeaders: "Content-Type, Authorization", exposeHeaders: "Content-Type, Authorization", maxAge: "3600" } } } }); // Or with multiple allowed origins const server = new MCPServer({ transport: { type: "sse", options: { cors: { allowOrigin: "https://app1.com, https://app2.com", allowMethods: "GET, POST, OPTIONS", allowHeaders: "Content-Type, Authorization, Custom-Header", exposeHeaders: "Content-Type, Authorization", maxAge: "86400" } } } });

認証

MCPフレームワークは、SSEエンドポイントにオプションの認証を提供します。JWT認証とAPIキー認証のいずれかを選択するか、独自のカスタム認証プロバイダーを実装できます。

JWT認証

import { MCPServer, JWTAuthProvider } from "mcp-framework"; import { Algorithm } from "jsonwebtoken"; const server = new MCPServer({ transport: { type: "sse", options: { auth: { provider: new JWTAuthProvider({ secret: process.env.JWT_SECRET, algorithms: ["HS256" as Algorithm], // Optional (default: ["HS256"]) headerName: "Authorization" // Optional (default: "Authorization") }), endpoints: { sse: true, // Protect SSE endpoint (default: false) messages: true // Protect message endpoint (default: true) } } } } });

クライアントは Authorization ヘッダーに有効な JWT トークンを含める必要があります。

Authorization: Bearer eyJhbGciOiJIUzI1NiIs...

APIキー認証

import { MCPServer, APIKeyAuthProvider } from "mcp-framework"; const server = new MCPServer({ transport: { type: "sse", options: { auth: { provider: new APIKeyAuthProvider({ keys: [process.env.API_KEY], headerName: "X-API-Key" // Optional (default: "X-API-Key") }) } } } });

クライアントは、X-API-Key ヘッダーに有効な API キーを含める必要があります。

X-API-Key: your-api-key

カスタム認証

AuthProviderインターフェイスを実装することで、独自の認証プロバイダーを実装できます。

import { AuthProvider, AuthResult } from "mcp-framework"; import { IncomingMessage } from "node:http"; class CustomAuthProvider implements AuthProvider { async authenticate(req: IncomingMessage): Promise<boolean | AuthResult> { // Implement your custom authentication logic return true; } getAuthError() { return { status: 401, message: "Authentication failed" }; } }

ライセンス

マサチューセッツ工科大学

-
security - not tested
F
license - not found
-
quality - not tested

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/ronangrant/mcp-framework'

If you have feedback or need assistance with the MCP directory API, please join our Discord server