Calculator SSE

🧮 MCP サーバーの段階的な実装と Microsoft Copilot Studio および Github Copilot Agent への統合

これは、Model Context Protocol SDKを使用した、Node.js + TypeScript の MCP SDK デモです。MCP を通じて BMI や加算などのシンプルな計算ツールを公開し、Server-Sent Events（SSE）によるリアルタイム応答をサポートします。 MCP Architecture と SSE トランスポートを使用して、MCP のアーキテクチャとベストプラクティスを確認してください。

🚀 機能

• ✅ SSE（Server-Sent Events）のサポート
• ✅ BMI 計算ツール
• ✅ 加算ツール
• ✅ MCP ツールと Github Copilot Agent の統合
• ✅ MCP ツールと Microsoft Copilot Studio の統合
• ✅ Azure App Service 対応

📁 プロジェクト構成

⚙️クイックスタート

npm install      # Install dependencies
npm run build    # Compile TypeScript
npm run start    # Start server (http://localhost:3001)

アプリは http://localhost:3001 で実行されます（別の設定をしている場合を除きます）。

🧪 MCP ツール

🔹 calculate-bmi

入力：

{
  "weightKg": 70,
  "heightM": 1.75
}

応答：

{
  "content": [{ "type": "text", "text": "22.86" }]
}

🔹 calculate-sum

入力

{
  "a": 5,
  "b": 3
}

応答：

{
  "content": [{ "type": "text", "text": "8" }]
}

🔁 SSE エンドポイント

サーバーは次のエンドポイントを介して Server-Sent Events（SSE）をサポートします：

GET /sse

---

🖥️ MCP ツールと Github Copilot Agent の統合（VSCode）

1. コマンドパレット（Ctrl+Shift+P または Cmd+Shift+P）を開きます。
2. "Add MCP Server" と入力し、選択します。
3. .vscode/mcp.json を次の内容で更新します：

{
    "servers": {
        "my-mcp-server": {
            "type": "sse",
            "url": "http://localhost:3001/sse"
        }
    }
}

Github Copilot Agent での結果

サーバーが表示され、正常に接続されます。

🖥️ MCP ツールと Microsoft Copilot Studio の統合（カスタムコネクタ）

カスタムコネクタを使用して Model Context Protocol（MCP）ツールを Microsoft Copilot Studio に統合する方法については、Microsoft の公式ドキュメントをご覧ください：🔗 Copilot Studio で MCP を使用して Copilot アクションを拡張する

MCP カスタムコネクタの Copilot Studio への統合

Copilot Studio でアクション用の MCP ツールをカスタムコネクタと連携させるための設定方法を説明します。

---

Swagger 仕様

swagger: '2.0'
info:
  title: MCPCalculatorDemo
  description: Calculate BMI and Calculate sum using MCP SSE server
  version: '1.0'
host: calculatormcp-dummyurl.azurewebsites.net
basePath: /
schemes:
  - https
definitions:
  QueryResponse:
    type: object
    properties:
      jsonrpc:
        type: string
      id:
        type: string
      method:
        type: string
      params:
        type: object
      result:
        type: object
      error:
        type: object
paths:
  /sse:
    get:
      summary: MCP Server Actions for calculating BMI and sum
      parameters:
        - in: query
          name: sessionId
          type: string
          required: false
      produces:
        - application/json
      responses:
        '200':
          description: Immediate Response
          schema:
            $ref: '#/definitions/QueryResponse'
        '201':
          description: Created and will follow callback
      operationId: CalculatorDemo
      tags:
        - Agentic
        - McpSse
securityDefinitions: {}
security: []

Copilot Studio での MCP サーバーアクションの使用

MCP サーバーアクションにアクセスする手順

1. Copilot Studio を開く
   Copilot Studio のワークスペースに移動します。

2. アクションに移動する
   左側のサイドバーにある Action メニューをクリックします。

3. 「Custom connector」を選択する
   Action メニューから Custom connector を選択します。

4. MCP サーバーアクションを見つける
   システムに使用可能なツールが自動的に表示されます。リストから MCP Server Action を選択します。

   

5. MCP サーバーアクションのプレビュー
   以下のように、選択した MCP サーバーアクションの詳細を確認できます。

   

📌 注意事項

• ✅ MCP トランスポートを初期化するとき、/sse エンドポイントは（プロトコルとホストを含む）完全な URI を返す必要があります。これにより、環境をまたいだデプロイ（例：localhost と Azure）でも互換性が確保されます。また、MCP のやり取りをストリーミングするためのライブ接続を確立します。

  例：

  const protocol = req.protocol;
  const host = req.get('host');
  const fullUri = `${protocol}://${host}/mcp`;
  

🔄 Return / Server-Sent Events (SSE) with Full URI

Ensure your custom connector supports SSE (Server-Sent Events) and returns the full URI as shown:

🏷️ Add Tags to Your Custom Connector

tags:
  - Agentic
  - McpSse

⚠️ 名前付けに関するガイダンス

operationId に "InvokeMCP" を使用しないでください。
アクションの目的を反映し、競合を避けられる、より具体的で説明的な名前を選択してください。

☁️ Azure へのデプロイ（任意）

Azure App Service（Node.js 18+）を作成します。 必要に応じて、スタートアップコマンドを設定します。

npm run build && npm run start

SSE デプロイの更新

Basic プランを使用し、West US 2 リージョンに Azure へ SSE をデプロイし、問題なくテストできました。

🛠️ トラブルシューティング

✅ SSE サーバーが正常に動作しているか確認する方法

次の手順に従って、SSE（Server-Sent Events）サーバーが正常に動作していることを確認します。

---

🔍 ステップ 1：SSE エンドポイントを閲覧する

• ブラウザーを開き、次のいずれかにアクセスします。

  • http://localhost:3000/sse（ローカルで実行している場合）、または
  • デプロイした Azure URL。

• Developer Tools → Network タブを開きます。

• EventStream 接続を探します。

• Event セクションに、次の項目が表示されます。

  • Endpoint：SSE エンドポイント
  • Data：完全な URI エンドポイント

---

🧪 ステップ 2：Postman で SSE エンドポイントをテストする

1. Full URI（EventStream の data から）をコピーします。
2. Postman を使用して、その URI に POST リクエストを送信します。

URL の例：

http://calculatormcp-dummyurl.azurewebsites.net/mcpfy/v1/calculatordemo?sessionId=620c84e1-81e2-484d-8737-a7fbc93165b1

リクエストペイロードの例：

{
  "jsonrpc": "2.0",
  "id": "2",
  "method": "tools/call",
  "params": {
    "name": "calculate-bmi",
    "arguments": {
      "weightKg": 180,
      "heightM": 1.8
    }
  }
}

成功すると、サーバーが正常に動作していることを確認する "message" を含むレスポンスが返されます。

---

🖼️ スクリーンショットの例

ブラウザーのネットワークイベントトレース：

Postman のレスポンス：

または、テストに MCP Inspector を使用できます。https://github.com/modelcontextprotocol/inspector

免責事項

これはサポート対象外、実験的なものであり、Microsoft の公式製品ではありません。サポートや、明示的または黙示的な保証を一切伴わず、現状有姿で提供されます。これには、商品性、特定目的への適合性、非侵害の保証が含まれますが、これらに限定されません。

いかなる場合も、作成者または著作権者は、本ソフトウェア、または本ソフトウェアの使用その他の取引に起因もしくは関連して生じる、契約、不法行為その他いかなる法的根拠に基づく請求、損害、その他の責任について、一切責任を負いません。

⚠️ 重要な注意事項：
これは、デモンストレーション目的で作成されたサンプルデモ用のカスタム MCP サーバーです。Microsoft Azure にデプロイされており、プロトタイピングまたはサンプルシナリオにおいて、Copilot Studio との統合のみを目的としています。
このコンポーネントは、Microsoft の公式製品には含まれておらず、本番環境での使用を想定していません。