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開発ワークフロー
プロジェクトを作成します。
mcp create my-mcp-server
cd my-mcp-server必要に応じてツールを追加します。
mcp add tool data-fetcher mcp add tool data-processor mcp add tool report-generator建てる：
npm run buildMCP クライアントに追加 (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}"]
}
}
}構築とテスト
ツールに変更を加える
`npm run build` を実行してコンパイルします
サーバーは起動時にツールを自動的に読み込みます
クイックスタート
ツールの作成
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"
};
}
}ライセンス
マサチューセッツ工科大学