Microsoft 365 Copilot でアプリとカスタム ツールを有効にする

[このトピックはプレリリース ドキュメントであり、変更されることがあります。]

Microsoft 365 Copilot の Power Apps を使用すると、ユーザーは Copilot から直接モデル駆動型アプリと対話できます。 ユーザーがエージェントに話しかけると、アプリのデータを対話型 UI、レコードを参照するためのグリッド、表示、編集、または作成のためのフォームとして、すべて Copilot エクスペリエンスを離れることなく表示できます。 さらに、カスタム MCP ツールと対話型 UI をアプリの宣言型エージェントに追加できます。 この機能は、 MCP サーバー が対話型ユーザー インターフェイスをホストに配信できるようにする MCP の拡張機能である MCP アプリを介して実現されます。 この機能は、アプリから MCP サーバーと宣言型エージェントを生成することによって機能します。

前提条件

• モデル駆動型アプリ。 現時点では、この機能はモデル駆動型アプリでのみ使用できます。
• Microsoft 365 Copilotライセンス。 エージェントをデプロイする作成者と、それを操作するエンド ユーザーの両方に必要です。
• Microsoft Teamsでカスタム アプリをアップロードするアクセス許可。 Microsoft 365 管理者は、これを有効にする必要がある場合があります。 アップロード オプションが表示されない場合は、Teams の管理者設定を確認します。

Copilot で Power Apps を設定する

1. Power Apps に移動し、目的の環境を選択して、目的のモデル駆動型アプリを開きます。

2. 左側のナビゲーション バーで [アプリ MCP ] アイコンを選択し、[ MCP のセットアップ] を選択します。 このアクションにより、アプリの MCP サーバーが設定されます。これにより、Copilot 会話用の MCP ツールが提供されます。 これは 1 回限りの手順であり、完了するまでに数秒かかる場合があります。

   

3. アプリを 保存 して 公開 します。

4. [ アプリ パッケージのダウンロード ] を選択して、アプリの MCP によって生成された宣言型エージェントをダウンロードします。 このパッケージには、エージェント定義、レコードとデータ用の組み込みツール、およびアプリのエクスペリエンスを Microsoft 365 copilot にデプロイするために必要な構成が含まれています。

   

5. 宣言型エージェント アプリの name.zip に似た名前の圧縮ファイルを、Microsoft Teamsまたは Microsoft 365 エージェントにアップロードします。

   • Teams: Teams でカスタム アプリとして個人用にアップロードします。 詳細情報 Teams でアプリをアップロードする
   • Microsoft 365 エージェント: Microsoft 365 管理センターからチームまたはグループのパッケージを発行します。 詳細情報: エージェントの公開

この宣言型エージェントから、アプリ内のテーブルに関する質問をできるようになりました。 組み込みのツールでは、データセット クエリの 対話型グリッド を表示できます。

さらに、 インテリジェントなフォームを 使用して、Microsoft 365 Copilot コンテキスト内でレコードを作成、表示、および編集できます。

カスタム ツールを作成する

アプリの宣言型エージェント内で利用できる組み込みのツールに加えて、カスタム ツールとウィジェットを組み込むことでその機能を拡張できます。 プロンプト ビルダー ベースのデザイナーを使用して、カスタム MCP ツールと対話型 UI コンポーネントをアプリの宣言型エージェントに統合できます。 たとえば、Zava Airlines アプリでは、カスタム ツールを追加して、フライト タイムラインと共にフライト マップをガント チャートとして並べて表示できます。

1. [アプリ MCP] タブの [ツール] セクションで、[カスタム ツールの作成] を選択します。

2. Microsoft 365 Copilot ではこの情報を使用して呼び出すタイミングを決定するため、ツールのわかりやすい 名前 と 説明 を指定します。

3. 既定で JSON 形式のツールのデータを出力する手順を追加します。 ツールに UX が関連付けられていない場合は、テキストに変更できます。 命令には、アプリ内のテーブルの特定のレコードに対するクエリを含めたり、ツール チェーンで使用するツールへの入力パラメーターを指定したりできます。 必ず実験し、適切なプロンプト AI モデルを選択してください。

   

4. [ テスト ] を選択してツールの出力を確認して検証し、[ 次へ] を選択します。 このツールに固有のオプションの カスタム HTML を作成して貼り付けることができるようになりました。 この HTML は、 /generate-mcp-apps-ui skill または独自の開発ツールを使用して作成できます。 保存を選びます。

   

5. 更新されたアプリ パッケージ zip をダウンロードし、最新バージョンを Microsoft Teams または Microsoft 365 エージェントにアップロードします。

6. アプリ エージェントで関連するクエリを発行してツールを呼び出し、カスタム UI の動作を確認します。

   

動的ツール チェーン

Power Apps 宣言型エージェントでのツール チェーンでは、Microsoft 365 Copilot オーケストレーターを使用してユーザーの意図を推論し、複数の MCP を利用したアクション (ツール) を順番に動的に呼び出してタスクを完了します。 オーケストレーターは、コンテキストと関数の説明に基づいて MCP アプリ アクションの適切な組み合わせを選択、パラメーター化、実行し、Power Apps とエンタープライズ システム全体でエンドツーエンドのワークフローを可能にします。 パラメーター化された入力を使用してツールを作成する方法を次に示します。

1. [アプリ MCP] タブの [ツール] セクションで、[カスタム ツールの作成] を選択します。

2. Microsoft 365 Copilot ではこの情報を使用して呼び出すタイミングを決定するため、ツールのわかりやすい 名前 と 説明 を指定します。

3. この例では、Sankey グラフ ビジュアライザーを使用します。 まず、Sankey グラフを生成するために必要な JSON 入力スキーマを定義します。 次に、Sankey グラフ ビジュアライザー ツールのプロンプトを作成します。 ツールは、 SankeyDiagramVisualizationInputDataという名前の入力パラメーターを公開します。 このパラメーターはツールによって解釈され、ビジュアライザーで想定される JSON 構造に変換されます。 LLM がツールを正しく識別して呼び出すことができるように、明確でわかりやすい入力パラメーター名を選択します。

   

4. これで、このツールに固有の カスタム HTML を作成して貼り付けることができます。 この HTML は、 /generate-mcp-apps-ui skill または独自の開発ツールを使用して作成できます。 保存を選びます。

5. 更新されたアプリ パッケージ zip をダウンロードし、最新バージョンを Microsoft Teams または Microsoft 365 エージェントにアップロードします。

6. Copilot では、自然言語クエリを使用してデータをフェッチし、視覚化のためにツールに渡すようになりました。 たとえば、複雑なクエリを使用して、"issues" テーブル データから入力を動的に取得し、Sankey Chart Visualizer ツールを使用してそれらを視覚化できます。

   

7. 会話を続けることで、Sankey グラフをさらに絞り込むことができます。

   

全画面表示の例

この例では、ホストが全画面表示モードをサポートしている場合にのみ、展開ボタンがレンダリングされます。

function renderExpandButton(app) {
  const ctx = app.getHostContext();

  // Don't render the button if the host doesn't support fullscreen
  if (!ctx?.availableDisplayModes?.includes('fullscreen')) {
    return null;
  }

  const btn = document.createElement('button');
  btn.addEventListener('click', async () => {
    const result = await app.requestDisplayMode({ mode: 'fullscreen' });
    // Always use result.mode — the host may grant a different mode than requested
    console.log('Granted mode:', result.mode);
  });
  return btn;
}

同じガードは、任意のホスト機能に適用されます。 使用する前に getHostContext() を確認します。

const ctx = app.getHostContext();

// Theme
if (ctx?.theme) applyTheme(ctx.theme);

// Current display mode
if (ctx?.displayMode === 'fullscreen') { /* adjust layout */ }

// Available modes
if (ctx?.availableDisplayModes?.includes('inline')) { /* show collapse option */ }

実行時に onhostcontextchanged を介して機能の変更に対応します。ホスト コンテキストは、 connect()後に更新できます。

app.onhostcontextchanged = (ctx) => {
  if (ctx.theme) applyTheme(ctx.theme);
  if (ctx.displayMode) updateLayout(ctx.displayMode);
};

ツールの結果で全画面表示モードを使用する

一般的なパターンは、ウィジェットがデータを受け取ったときに自動的に全画面表示に切り替え、コンテンツにレンダリングする領域を増やします。

app.ontoolresult = async (result) => {
  const data = result.structuredContent;
  if (!data) return;

  // Expand to fullscreen when data arrives, if the host supports it
  const ctx = app.getHostContext();
  if (ctx?.availableDisplayModes?.includes('fullscreen') && currentMode !== 'fullscreen') {
    const granted = await app.requestDisplayMode({ mode: 'fullscreen' });
    currentMode = granted.mode;
    document.body.classList.toggle('mode-fullscreen', currentMode === 'fullscreen');
  }

  renderData(data);
};

ユーザーに決定させる方法としては、まず現在のモードにレンダリングし、その後で展開ボタンを提供することも可能です。

app.ontoolresult = (result) => {
  const data = result.structuredContent;
  if (!data) return;

  renderData(data);        // render in whatever mode is active
  updateExpandBtn();       // show the expand button now that there is content
};

関連資料

AI コード生成ツールを使用して MCP アプリ ウィジェットを生成する

エージェントの Power Apps に関する FAQ