Azure Container Apps - AI & MCP Playground

Azure Container Apps - AI & MCP プレイグラウンド

このプロジェクトでは、OpenAI、Azure OpenAI、GitHub Models で MCP プロトコルを使用する方法を紹介します。TODO リストエージェントとやり取りする、シンプルなデモ用ターミナルアプリケーションを提供します。 エージェントは、MCP サーバーが提供する一連のツールにアクセスできます。

MCP コンポーネント

現在の実装は、次の 3 つの主要コンポーネントで構成されています。

1. MCP ホスト：MCP サーバーおよび LLM プロバイダーとやり取りするメインアプリケーションです。ホストは LLM プロバイダーをインスタンス化し、ユーザーがエージェントとやり取りするためのターミナルインターフェイスを提供します。
2. MCP クライアント：MCP プロトコルを使用して MCP サーバーと通信するクライアントです。このアプリケーションは、HTTP と SSE（Server-Sent Events）の両方のプロトコルに対応する 2 つの MCP クライアントを提供します。
3. MCP サーバー：MCP プロトコルを実装し、DocumentDB データベースと通信するサーバーです。このアプリケーションは、HTTP を使用するものと SSE（Server-Sent Events）を使用するものの 2 つの MCP サーバー実装を提供します。
4. LLM プロバイダー：MCP ホストからの入力に基づいて応答を生成する言語モデルプロバイダー（例：OpenAI、Azure OpenAI、GitHub Models）です。
5. DocumentDB Local：エージェントとツールの状態を保存するために使用するデータベースです。
6. ツール：エージェントがショッピングリストへの項目の追加や一覧表示などの操作を実行するために使用できる一連のツールです。

flowchart TD
    user(("fa:fa-users User"))
    host["VS Code, Copilot, LlamaIndex, Langchain..."]
    client[MCP SSE Client]
    clientHttp[MCP HTTP Client]
    server([MCP SSE Server])
    serverHttp([MCP HTTP Server])
    agent[Agent]
    AzureOpenAI([Azure OpenAI])
    GitHub([GitHub Models])
    OpenAI([OpenAI])
    
    tools["fa:fa-wrench Tools"]
    db[(DocumentDB Local)]

    user --> hostGroup 
    subgraph hostGroup["MCP Host"]
        host -.- client & clientHttp & agent
    end
    
    agent -.- AzureOpenAI & GitHub & OpenAI
    
    client a@ ---> |"Server Sent Events"| server
    clientHttp aa@ ---> |"Streamable HTTP"| serverHttp

    subgraph container["ACA Container (*)"]
      server -.- tools
      serverHttp -.- tools
      tools -.- add_todo 
      tools -.- list_todos
      tools -.- complete_todo
      tools -.- delete_todo
    end

    add_todo b@ --> db
    list_todos c@--> db
    complete_todo d@ --> db
    delete_todo e@ --> db
    
    %% styles

    classDef animate stroke-dasharray: 9,5,stroke-dashoffset: 900,animation: dash 25s linear infinite;
    classDef highlight fill:#9B77E8,color:#fff,stroke:#5EB4D8,stroke-width:2px
    
    class a animate
    class aa animate
    class b animate
    class c animate
    class d animate
    class e animate

    class container highlight

MCP サーバーがサポートする機能と機能性

このデモアプリケーションは、HTTP を使用するものと SSE（Server-Sent Events）を使用するものの 2 つの MCP サーバー実装を提供します。MCP ホストは両方のサーバーに接続できるため、ニーズに最適なものを選択できます。

機能	完了
SSE（レガシー）	✅
HTTP ストリーミング	✅
AuthN（トークンベース）	wip
ツール	✅
リソース	#3
プロンプト	#4
サンプリング	#5

クイックスタート（Docker を使用）

Docker を使用してこのプロジェクトを開始するには、次の手順に従ってください。

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

git clone https://github.com/Azure-Samples/azure-container-apps-ai-mcp.git
cd azure-container-apps-ai-mcp

2. Docker コンテナーを起動します。

docker-compose up

3. ./.vscode/mcp.json を参照して、VS Code に組み込まれた MPC サポートを使用して MCP サーバーにアクセスします。すべてのデータは DocumentDB Local データベースに永続化されます。DocumentDB 用 VS Code 拡張機能を使用して、データベースを調べることができます。

ローカル開発

このプロジェクトを開始するには、次の手順に従ってください。

前提条件

• Node.js と npm（バージョン 22 以降）
• Docker（MCP サーバーと DocumentDB Local を Docker で実行する場合に推奨）
• OpenAI 互換のエンドポイント：
  • OpenAI API キー
  • または、GitHub モデルを使用する場合は GitHub トークン：https://gh.io/models
  • または、Azure OpenAI を使用する場合は、Azure OpenAI リソースと対応するエンドポイントが必要です。

インストール

1. リポジトリをクローンします。
2. 依存関係をインストールします。

npm install --prefix mcp-host
npm install --prefix mcp-server-http
npm install --prefix mcp-server-sse

使用する LLM プロバイダーの設定

このサンプルは、次の LLM プロバイダーをサポートしています。

プロバイダー	サポートされている API
Azure OpenAI	Responses API
OpenAI	Responses API
GitHub Models	ChatCompletion API

Azure OpenAI

メモ

Docker コンテナー内で実行している場合、マネージド ID を使用した Azure OpenAI へのアクセスはサポートされていません。Docker を使用せずにローカルでコードを実行するか、AZURE_OPENAI_API_KEY によるキー認証など、別の認証方法を使用してください。

Azure マネージド ID を使用してキーなし認証を行うには、.env ファイルに環境変数 AZURE_OPENAI_ENDPOINT を設定する必要があります。

AZURE_OPENAI_ENDPOINT="https://<ai-foundry-openai-project>.openai.azure.com"
MODEL="gpt-4.1"

# (optional) Set the Azure OpenAI API key if you are not using Managed Identity
# AZURE_OPENAI_API_KEY=your_azure_openai_api_key

また、Azure CLI を使用して Azure アカウントにログインし、サブスクリプションを選択する手順に従ってください。

az login

OpenAI

OpenAI API を使用するには、.env ファイルにキー OPENAI_API_KEY を設定する必要があります。

OPENAI_API_KEY=your_openai_api_key
MODEL="gpt-5"

GitHub Models

GitHub models を使用するには、.env ファイルに GITHUB_TOKEN を設定する必要があります。

GITHUB_TOKEN=your_github_token
MODEL="openai/gpt-5"

MCP サーバーの実行

DevContainer での実行（推奨）

このプロジェクトには、コンテナー化された環境で MCP サーバーを実行できる DevContainer 設定が含まれています。すべての依存関係が正しくインストールおよび設定されるため、MCP サーバーの実行にはこの方法を推奨します。

DevContainer でプロジェクトを開いたら、以下の Docker のセクションに記載されている手順で MCP サーバーを実行できます。

Docker での実行

付属の Docker Compose ファイルを使用して、両方の MCP サーバーを Docker コンテナー内で実行できます。これはテストや開発に役立ちます。実行するには、次の手順に従ってください。

1. お使いのマシンに Docker がインストールされていることを確認します。ターミナルで docker compose と入力し、Docker Compose がインストールされているか確認してください。
2. プロジェクトのルートディレクトリに移動し、次のコマンドを実行してコンテナーをビルドして起動します。

docker compose up -d --build

このコマンドは、HTTP および SSE の MCP サーバーと DocumentDB データベースコンテナーをビルドして起動します。

3. 別のターミナルで次のコマンドを実行し、MCP ホストのターミナルにアクセスします。

docker exec -it mcp-host bash

4. コンテナー内で MCP ホストを実行し、上記の「使用方法」セクションで説明されているとおりに LLM エージェントとやり取りできます。

Docker を使わずに実行する

1. まず、別々のターミナルで MCP サーバーを実行します。

npm start --prefix mcp-server-http
npm start --prefix mcp-server-sse

メモ

デモ用に、MCP ホスト（以下を参照）は両方のサーバー（ポート 3000 および 3001）に接続するよう設定されています。ただし、これは必須ではなく、使用するサーバーを選択できます。サーバーが利用できない場合、ホストはエラーを出力し、ほかのサーバーのスキャンを続けます。利用可能なサーバーがない場合、エージェントはツールを利用できません。

1. 別のターミナルで MCP ホストを実行します。

npm start --prefix mcp-host

MCP ホストを使って LLM エージェントとやり取りできるはずです。ショッピングリストへのアイテムの追加や、リストの表示について質問してみてください。ホストは MCP サーバーからツールを取得して呼び出します。

デバッグとインスペクション

環境変数 DEBUG を使用すると、MCP ホストの詳細なログ出力を有効にできます。

DEBUG=mcp:* npm start --prefix mcp-host

両方の MCP サーバーでは、デバッグがデフォルトで有効になっています。

ライセンス

このプロジェクトは MIT ライセンスの下でライセンスされています。詳細については、LICENSE ファイルを参照してください。