AI エージェントがインタラクティブな UI を返すことを可能にする MCP UI

要約

MCP UIはMCPを拡張し、AIエージェントの応答をテキストだけでなくインタラクティブなUIとして表示できるようにするフレームワークです。TypeScriptとRubyのSDKが提供されており、サーバー側（@mcp-ui/server）とクライアント側（@mcp-ui/client）に分かれています。クライアントSDKはReactコンポーネントとWebコンポーネントの両方をサポートしています。サーバー実装にはCloudflareのagentsパッケージを使用し、McpAgentクラスを継承してMCPツールを定義します。UIコンポーネントはMCPのResourceとして提供され、Resource LinkまたはEmbedded Resourceとしてツール応答に含めることができます。

📌

Key Points

•MCP UIはMCPを拡張し、AIエージェントがグラフ・購入フォーム・画像ギャラリーなどのインタラクティブなUIを返せるようにする
•TypeScript SDKは@mcp-ui/server（サーバー側）と@mcp-ui/client（クライアント側）の2つに分かれており、ReactおよびWebコンポーネントに対応
•CloudflareのagentsパッケージとStreamable HTTPを組み合わせてリモートMCPサーバーを実装し、createUIResource関数でUIリソースを生成する

Why it matters

AIエージェントとのインタラクションがテキスト応答を超えてリッチなUIへ進化することで、チャットインターフェース上での商取引・データ可視化・フォーム入力など、より実用的なユースケースが広がります。

原文を読む