ホスト ページからダイアログ ボックスにメッセージを渡す別の方法
親ページから子ダイアログにデータとメッセージを渡すには、「Office アドインで Office ダイアログ API を使用する」の説明に従って、messageChild メソッドを使用することをお勧めします。DialogApi 1.2 要件セットをサポートしていないプラットフォームまたはホストでアドインが実行されている場合は、ダイアログに情報を渡す方法が他に 2 つあります。
ホスト ウィンドウとダイアログの両方からアクセスできる場所に情報を格納します。 2 つのウィンドウは共通のセッション ストレージ ( Window.sessionStorage プロパティ) を共有しませんが、 同じドメイン (ポート番号がある場合は含む) を持っている場合は、共通の ローカル ストレージを共有します。
注:
ブラウザーのセキュリティの変更は、トークン処理の戦略に影響します。
- アドインが Microsoft Edge レガシ (Chromium 以外) または 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;
クエリ パラメーターの使用
次の例は、クエリ パラメーターを使用してデータを渡す方法を示します。
Office.context.ui.displayDialogAsync('https://myAddinDomain/myDialog.html?clientID=15963ac5-314f-4d9b-b5a1-ccb2f1aea248');
この手法を使用するサンプルについては、「PowerPoint アドインで Microsoft Graph を使用した Excel グラフの挿入」を参照してください。
ダイアログ ボックス内のコードは、URL を解析し、パラメーター値を読み取ることができます。
重要
Office は、_host_info に渡される URL に displayDialogAsync というクエリ パラメーターを自動的に追加します (カスタム クエリ パラメーターが存在する場合は、その後に追加されます。 (カスタム クエリ パラメーター (存在する場合) の後に追加されます。ダイアログ ボックスが移動する後続の URL には追加されません)。Microsoft は、この値の内容を変更したり、今後完全に削除したりする可能性があるため、コードで読み取る必要はありません。 ダイアログ ボックスのセッション ストレージ ( Window.sessionStorage プロパティ) にも同じ値が追加されます。 この場合も、コードではこの値に対する読み取りも書き込みも行わないでください。
Office Add-ins