ホスト ページからダイアログ ボックスにメッセージを渡す別の方法

親ページから子ダイアログにデータとメッセージを渡すには、「Office アドインで Office ダイアログ API を使用する」の説明に従って、messageChild メソッドを使用することをお勧めします。DialogApi 1.2 要件セットをサポートしていないプラットフォームまたはホストでアドインが実行されている場合は、他の 2 つの方法を使用してダイアログに情報を渡すことができます。

• ホスト ウィンドウとダイアログの両方からアクセスできる場所に情報を格納します。 2 つのウィンドウは共通のセッション ストレージ ( Window.sessionStorage プロパティ) を共有しませんが、 同じドメイン (ポート番号がある場合は含む) を持っている場合は、共通の ローカル ストレージを共有します。

  注:

  ブラウザーのセキュリティの変更は、トークン処理の戦略に影響します。

  • アドインが Safari ブラウザーのOffice on the webで実行されている場合、ダイアログと作業ウィンドウは同じローカル ストレージを共有しないため、それらの間の通信に使用することはできません。
  • Chrome や Edge などの Chromium ベースのブラウザーのバージョン 115 以降では、ストレージパーティション分割を有効にして、特定のサイドチャネルクロスサイト追跡を防ぎます (「Microsoft Edge ブラウザー ポリシー」も参照)。 つまり、ローカル ストレージなどのストレージ API によって格納されたデータは、同じ配信元と同じトップレベル サイトを持つコンテキストでのみ使用できます。 可能であれば、「Office アドインで Office ダイアログ API を使用する」の説明に従って、messageParent メソッドと messageChild メソッドを使用して、ダイアログと作業ウィンドウの間でデータを渡すことをお勧めします。

• displayDialogAsync に渡される URL にクエリ パラメーターを追加します。

ローカル ストレージの使用

ローカル ストレージを使用するには、次の例に示すように、displayDialogAsync呼び出しの前に、ホスト ページの window.localStorage オブジェクトの setItem メソッドを呼び出します。

localStorage.setItem("clientID", "15963ac5-314f-4d9b-b5a1-ccb2f1aea248");

ダイアログ ボックスのコードは、次の例に示すように、必要に応じて項目を読み取ります。

const clientID = localStorage.getItem("clientID");
// You can also use property syntax:
// const clientID = localStorage.clientID;

クエリ パラメーターの使用

この方法は、ダイアログが最初に開いたときにのみ必要な小さな値に使用します。

ホスト ページで、 displayDialogAsyncに渡される URL にクエリ パラメーターを追加します。

Office.context.ui.displayDialogAsync('https://myAddinDomain/myDialog.html?clientID=15963ac5-314f-4d9b-b5a1-ccb2f1aea248');

この手法を使用するサンプルについては、「PowerPoint アドインで Microsoft Graph を使用した Excel グラフの挿入」を参照してください。

ダイアログ ボックス内のコードは、URL を解析し、パラメーター値を読み取ることができます。

一般的な問題のトラブルシューティング

• ダイアログでローカル ストレージが空の場合は、ホスト ページとダイアログでまったく同じ配信元が使用されていることを確認します。
• クエリ パラメーターの値が見つからない場合は、 displayDialogAsyncに渡される初期 URL に存在することを確認します。
• ダイアログ フローのリダイレクト後にデータが必要な場合は、クエリ パラメーターのみに依存するのではなく、ローカル ストレージまたはサーバーの状態を使用します。

関連項目

• Office アドインで Office ダイアログ API を使用する
• Office Dialog API のベスト プラクティスとルール
• [Office] ダイアログ ボックスでエラーとイベントを処理する