MCP サーバー & クライアント (Azure OpenAI & OpenAI 対応)

Model Context Protocol (MCP) と Azure OpenAI を利用した最小限のサーバー/クライアントアプリケーションの実装です。
1. MCP サーバーは FastMCP で構築されています。
2. Playwright は、モダンな Web アプリケーションをテストするための Microsoft 製のオープンソースのエンドツーエンドテストフレームワークです。
3. ツールに関する MCP レスポンスは、OpenAI の関数呼び出し形式に変換されます。
4. MCP サーバーのレスポンスを OpenAI の関数呼び出し形式に変換するブリッジは、MCP-LLM Bridge 実装をカスタマイズしたものです。
5. 安定した接続を確保するため、サーバーオブジェクトはブリッジに直接渡されます。
6. client_bridge は、インプロセスおよび外部 (stdio) の両方の MCP サーバー接続をサポートしており、さまざまなクライアント (Claude Code、VS Code、カスタムスクリプトなど) で再利用可能です。

Related MCP server: MCP Simple OpenAI Assistant

Model Context Protocol (MCP)

Model Context Protocol (MCP) は、AI アプリケーションとローカルまたはリモートのリソースとの間で、安全かつ制御された対話を可能にするオープンプロトコルです。

公式リポジトリ

コミュニティリソース

MCP Playwright

設定

2024年12月時点の開発フェーズでは、Python プロジェクトは 'uv' で開始する必要があります。'pip' や 'poetry' などの他の依存関係管理ライブラリは、MCP CLI ではまだ完全にはサポートされていません。

.env.template を .env にリネームし、Azure OpenAI 用の値を .env に入力します。

AZURE_OPEN_AI_ENDPOINT=
AZURE_OPEN_AI_API_KEY=
AZURE_OPEN_AI_DEPLOYMENT_MODEL=
AZURE_OPEN_AI_API_VERSION=

Python ライブラリ管理のために uv をインストールします。
```
pip install uv
uv sync
```
python chatgui.py を実行します。
- サンプル画面では、クライアントがブラウザを起動して URL に移動する様子が表示されます。

外部クライアントでの使用

MCP サーバーは、mcp.json 設定を介して外部クライアント (Claude Desktop、VS Code、Claude Code など) から使用できます。

Claude Desktop / Claude Code

claude_desktop_config.json (Claude Desktop) または .claude/mcp.json (Claude Code) に以下を追加します。

{
  "mcpServers": {
    "browser-navigator": {
      "command": "uv",
      "args": ["run", "fastmcp", "run", "./server/browser_navigator_server.py:app"],
      "cwd": "/path/to/mcp-aoai-web-browsing",
      "env": {
        "AZURE_OPEN_AI_ENDPOINT": "...",
        "AZURE_OPEN_AI_API_KEY": "...",
        "AZURE_OPEN_AI_DEPLOYMENT_MODEL": "...",
        "AZURE_OPEN_AI_API_VERSION": "..."
      }
    }
  }
}

VS Code

ワークスペースの .vscode/mcp.json に以下を追加します。

{
  "servers": {
    "browser-navigator": {
      "command": "uv",
      "args": ["run", "fastmcp", "run", "./server/browser_navigator_server.py:app"],
      "cwd": "${workspaceFolder}",
      "env": {
        "AZURE_OPEN_AI_ENDPOINT": "...",
        "AZURE_OPEN_AI_API_KEY": "...",
        "AZURE_OPEN_AI_DEPLOYMENT_MODEL": "...",
        "AZURE_OPEN_AI_API_VERSION": "..."
      }
    }
  }
}

ブリッジをプログラムから使用する (stdio)

client_bridge は、Python から stdio を介して外部 MCP サーバーに接続することもサポートしています。

from client_bridge import BridgeConfig, MCPServerConfig, BridgeManager
from client_bridge.llm_config import get_default_llm_config

config = BridgeConfig(
    server_config=MCPServerConfig(
        command="uv",
        args=["run", "fastmcp", "run", "./server/browser_navigator_server.py:app"],
    ),
    llm_config=get_default_llm_config(),
    system_prompt="You are a helpful assistant.",
)

async with BridgeManager(config) as bridge:
    response = await bridge.process_message("Navigate to https://example.com")

標準の OpenAI (Azure 以外) を使用する場合

from client_bridge.llm_config import get_openai_llm_config

config = BridgeConfig(
    mcp=server,
    llm_config=get_openai_llm_config(),
)

環境変数を設定します。

OPENAI_API_KEY=sk-...
OPENAI_MODEL=gpt-...

直接的なツール実行

独自の LLM ループを管理するクライアント向けに、ブリッジはツールメタデータと直接実行機能を提供します。

async with BridgeManager(config) as bridge:
    tools = bridge.get_tools()  # OpenAI function calling format
    result = await bridge.execute_tool("playwright_navigate", {"url": "https://example.com"})

'stdio' について

stdio はトランスポート層 (生のデータフロー) であり、JSON-RPC はアプリケーションプロトコル (構造化された通信) です。これらは別個のものですが、プロトコル内では「stdio 上の JSON-RPC」のように、しばしば同義として扱われます。

ツール説明

@self.mcp.tool()
async def playwright_navigate(url: str, timeout=30000, wait_until="load"):
    """Navigate to a URL.""" -> This comment provides a description, which may be used in a mechanism similar to function calling in LLMs.

# Output
Tool(name='playwright_navigate', description='Navigate to a URL.', inputSchema={'properties': {'url': {'title': 'Url', 'type': 'string'}, 'timeout': {'default': 30000, 'title': 'timeout', 'type': 'string'}

ヒント: uv

機能

uv run: Run a script.
uv venv: Create a new virtual environment. By default, '.venv'.
uv add: Add a dependency to a script
uv remove: Remove a dependency from a script
uv sync: Sync (Install) the project's dependencies with the environment.

ヒント

python.exe 用の taskkill コマンド

taskkill /IM python.exe /F

Visual Code: Python デバッガー: launch.json を使用したデバッグは、.vscode/launch.json の設定を使用してデバッガーを起動します。

Azure OpenAI