MCPフレームワーク
モデル コンテキスト プロトコル (MCP) サーバーを構築するための TypeScript フレームワーク。
オリジナルからの変更点
このフォーク (@ronangrant/mcp-framework) には、次の改善が含まれています。
- 互換性と信頼性を向上させるために、ファイルベースのログ記録をコンソールのみのログ記録に置き換えました。
- ログのファイルシステムへの依存をなくし、ENOENT エラーを排除しました
- 同じインターフェースを維持しながら、ログの実装を簡素化
- すべてのログが console.error() 経由で stderr に出力されるようになりました
インストール
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
- 建てる：
- 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}"]
}
}
}
構築とテスト
- ツールに変更を加える
- `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")
}
}
}
});
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 キーを含める必要があります。
カスタム認証
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"
};
}
}
ライセンス
マサチューセッツ工科大学