Electron MCP Server 🚀

ElectronでModel Context Protocol (MCP) サーバを実装したアプリケーション

ElectronアプリケーションとしてMCPサーバを起動し、Claude DesktopなどのAIアプリケーションから簡単に利用できるようにします。npxやNode.jsのインストールが不要で、エンジニアでない方でも簡単に使用できます。

特徴

✅ 簡単起動: Electronアプリとして起動するだけでMCPサーバが開始
✅ Streamable HTTP対応: 最新のMCP仕様に準拠
✅ GUI管理: サーバー状態の監視と制御が可能
✅ クロスプラットフォーム: Windows、macOS、Linuxで動作
✅ npx不要: 実行ファイルとして配布可能

クイックスタート

開発環境での実行

依存関係のインストール
```
npm install
```
アプリケーションの起動
```
npm start
```
開発モードで起動（DevToolsが開きます）
```
npm run dev
```

アプリケーションが起動すると、自動的にポート3999でMCPサーバが開始されます。

MCPエンドポイント

メインエンドポイント: http://localhost:3999/mcp
ヘルスチェック: http://localhost:3999/health

Claude Desktopでの設定

Claude Desktopの設定ファイル（claude_desktop_config.json）に以下を追加：

{
  "mcpServers": {
    "electron-mcp-server": {
      "command": "curl",
      "args": [
        "-X", "POST",
        "-H", "Content-Type: application/json",
        "-d", "{\"method\":\"initialize\",\"params\":{\"protocolVersion\":\"2025-01-01\",\"capabilities\":{},\"clientInfo\":{\"name\":\"claude-desktop\",\"version\":\"1.0.0\"}},\"id\":1}",
        "http://localhost:3999/mcp"
      ]
    }
  }
}

利用可能なツール

1. ping

サーバーの応答確認用ツール

{
  "method": "tools/call",
  "params": {
    "name": "ping",
    "arguments": {
      "message": "Hello World"
    }
  }
}

2. echo

メッセージをそのまま返すツール

{
  "method": "tools/call",
  "params": {
    "name": "echo",
    "arguments": {
      "message": "返したいメッセージ"
    }
  }
}

3. get_server_info

サーバー情報を取得するツール

{
  "method": "tools/call",
  "params": {
    "name": "get_server_info",
    "arguments": {}
  }
}

API使用例

ツール一覧の取得

curl -X POST http://localhost:3999/mcp \
  -H "Content-Type: application/json" \
  -d '{"method": "tools/list", "id": 1}'

pingツールの実行

curl -X POST http://localhost:3999/mcp \
  -H "Content-Type: application/json" \
  -d '{"method": "tools/call", "params": {"name": "ping", "arguments": {"message": "Test"}}, "id": 2}'

ビルドと配布

実行ファイルの作成

ローカルでのビルド

環境変数を設定してビルド：

# GitHub Personal Access Tokenを設定
export GH_TOKEN=your_github_token

# Windows向け
npm run build:win

# macOS向け
npm run build:mac

# Linux向け
npm run build:linux

または.envファイルを使用：

# .env.exampleをコピーして設定
cp .env.example .env
# .envファイルを編集してGH_TOKENを設定
npm run build:win

GitHub Actionsでの自動ビルド

リポジトリのSettings → Secrets and variables → Actions
ELECTRON_GITHUB_TOKENをRepository Secretとして追加
タグをpushまたはworkflow_dispatchで自動ビルド

ビルドされたファイルはdist/フォルダに出力されます。

⚠️ セキュリティ注意: .envファイルは絶対にリポジトリにコミットしないでください。

開発

プロジェクト構造

electron-mcp/
├── src/
│   ├── main.js          # Electronメインプロセス
│   ├── mcp-server.js    # MCPサーバー実装
│   └── preload.js       # プリロードスクリプト
├── public/
│   ├── index.html       # UI
│   ├── style.css        # スタイル
│   └── renderer.js      # レンダラープロセス
├── package.json
└── README.md

カスタムツールの追加

src/mcp-server.jsのsetupMCPHandlers()メソッドで新しいツールを追加できます：

// tools/listハンドラーにツールを追加
{
  name: 'my_custom_tool',
  description: 'カスタムツールの説明',
  inputSchema: {
    type: 'object',
    properties: {
      param1: {
        type: 'string',
        description: 'パラメータの説明'
      }
    },
    required: ['param1']
  }
}

// tools/callハンドラーに処理を追加
case 'my_custom_tool':
  return {
    content: [{
      type: 'text',
      text: `結果: ${args.param1}`
    }]
  };

トラブルシューティング

ポート3999が使用中の場合

環境変数MCP_PORTでポートを変更できます：

MCP_PORT=4000 npm start

WSL環境でのDBusエラー

WSL環境では以下のエラーが表示される場合がありますが、アプリケーションの動作には影響しません：

ERROR:object_proxy.cc(577)] Failed to call method: org.freedesktop.DBus.StartServiceByName

ライセンス

MIT License

技術スタック

Electron: ^28.0.0
Express: ^4.18.2
@modelcontextprotocol/sdk: ^0.5.0
CORS: ^2.8.5

貢献

Issues、Pull Requestを歓迎します。

Electron MCP Server

README Documentation