C# MCP Server & Blazor WebAssembly Inspector

ブログ記事「BlazorフロントエンドでC# MCP Serverを構築する」の付属コードリポジトリです。

このリポジトリは、.NET 9上のC#で本番品質のModel Context Protocol (MCP)実装を提供し、インタラクティブなBlazor WebAssembly Tool Inspector & Protocol Monitorと組み合わせたものです。

🚀 アーキテクチャのハイライト

• Standard MCP Protocol Engine: 公式のModel Context ProtocolをServer-Sent Events（GET /sse）とJSON-RPC 2.0（POST /messages）で実装し、Claude Desktop、Cursor、VS Code、Anthropic MCP Inspector CLIなどの外部AIクライアントをサポートします。

• Native C# Tool Reflection: 型指定されたC#メソッドを、Microsoft.Extensions.AI（AIFunctionFactory）とSystem.Text.Jsonによる自動スキーマ生成を使用して、検出可能なMCPツールとして公開します。

• Interactive Blazor WASM Inspector: 生成されたJSONスキーマを検査し、カスタムパラメータフォームでツール実行をテストし、リアルタイムのJSON-RPC通信ログを監視する開発者向けGUIです。

• Zero-Config Local Dev vs Guarded Production: ローカル開発はシークレットなしで摩擦なく実行できます。非Development環境ではJWT Bearer認証、レート制限、リクエストタイムアウトが適用されます。

Related MCP server: sharplens-mcp

📁 ソリューション構成

• McpServerApp/McpServerApp: /sse、/messages、/api/mcpエンドポイントをホストするASP.NET Coreサーバー。

• McpServerApp/McpServerApp.Client: インタラクティブなInspector UIを提供するBlazor WebAssemblyクライアント。

• McpServerApp/McpServerApp.Tests: 完全な自動テストスイート（ユニットテスト、WebApplicationFactoryによる統合テスト、bUnit UIコンポーネントテスト）。

• e2e/: ツールの検出、実行、スクリーンショット取得を検証するPlaywrightブラウザテスト。

🛠️ はじめに

前提条件

• .NET 9.0 SDK（または.NET 10プレビュー）

• Node.js 20+（Playwrightブラウザテスト用）

ローカルでの実行

1. リポジトリをクローンします:

   git clone https://github.com/cmalpass/csharp-mcp-server-blazor.git
   cd csharp-mcp-server-blazor/McpServerApp

2. アプリケーションを実行します:

   dotnet run --project McpServerApp

3. ブラウザを開き、https://localhost:7150（またはターミナルに表示されるポート）にアクセスして、MCP Inspectorを確認してください。

🔌 外部AIクライアントの接続

1. Claude Desktop

このエントリをclaude_desktop_config.jsonに追加してください:

{
  "mcpServers": {
    "csharp-blazor-server": {
      "url": "http://localhost:5000/sse"
    }
  }
}

2. Cursor

Settings > Features > MCPに移動し、+ Add New MCP Serverをクリックして、SSEを選択し、http://localhost:5000/sseを指定します。

3. Anthropic CLI Inspector

npx @modelcontextprotocol/inspector http://localhost:5000/sse

🧪 テスト

決定論的テストスイート（.NET）

ユニットテスト、統合テスト、bUnitコンポーネントテストを実行します:

dotnet test McpServerApp/McpServerApp.sln --configuration Release

ブラウザE2Eテスト（Playwright）

npm ci
npm run test:e2e

これにより、ブラウザの完全なフローが実行され、docs/evidence/mcp-inspector-execution.pngにスクリーンショットの証拠が生成されます。

📜 ライセンス

このプロジェクトはMIT Licenseの下でライセンスされています。