ブラウザーまたは webview コントロールは、同じ配信元ポリシーを適用します。これにより、あるドメインから読み込まれたスクリプトが別のドメインから Web ページのプロパティを取得または操作できなくなります。 このポリシーは、既定では、要求された URL のドメインが現在の Web ページのドメインと同じである必要があることを意味します。 たとえば、このポリシーでは、1 つのドメイン内の Web ページが、ホストされているドメイン以外のドメインに 対して XmlHttpRequest Web サービス呼び出しを行うことを禁止します。
Office アドインは Webview コントロールでホストされるため、同じ配信元ポリシーが Web ページで実行されているスクリプトにも適用されます。
同一生成元ポリシーは、Web アプリケーションが複数のサブドメインに渡るコンテンツと API をホストしているときなど、多くの場合に不要な制約になることがあります。 いくつかの一般的な手法を使用して、同じ配信元ポリシーの適用を安全に克服できます。 この記事では、それらのいくつかを簡単に紹介します。 これらの手法の研究を開始するには、提供されているリンクを使用します。
トークン ベースの認証スキームを使用してサーバー側のコードを実装する
同じ配信元ポリシーの制限に対処する方法の 1 つは、 OAuth 2.0 フローを使用して、あるドメインが別のドメインでホストされているリソースへの承認されたアクセスを取得できるようにするサーバー側のコードを提供することです。
クロス オリジン リソース共有 (CORS) を使用する
クロスオリジン リソース共有の詳細については、Web で使用できる多くのリソース (クロスオリジン リソース共有 (CORS) など) を参照してください。
注:
アドインが Outlook でイベント ベースのアクティブ化または統合スパム レポートを使用する場合は、CORS または SSO を有効にするように既知の URI も構成する必要があります。 詳細については、「 イベント ベースまたはスパムレポート Office アドインでシングル サインオン (SSO) またはクロスオリジン リソース共有 (CORS) を使用する」を参照してください。
iframeとpostMessageを使用して独自のプロキシを構築する (ウィンドウ間メッセージング)
iframeとpostMessageを使用して独自のプロキシを構築する方法の例については、「ウィンドウ間メッセージング」を参照してください。
匿名アクセスに JSONP を使用する
同じ配信元ポリシーの制限を克服するもう 1 つの方法は、 JSONP を使用して Web サービスのプロキシを提供することです。 これを行うためには、任意のドメインでホストされているスクリプトを参照する src 属性を持つ script タグを使用します。
script タグをプログラムで作成し、src 属性で参照する URL を動的に作成すると、URI クエリ パラメーターを介してパラメーターを URL に渡すことができます。 Web サービス プロバイダーは、固有の URL で JavaScript コードを作成およびホストし、URI クエリ パラメーターに応じて異なるスクリプトを返します。 それらのスクリプトは挿入された場所で実行され、想定どおりに動作します。
次の JSONP の例では、任意の Office アドインで動作する手法を使用します。
// Dynamically create an HTML SCRIPT element that obtains the details for the specified video.
function loadVideoDetails(videoIndex) {
// Dynamically create a new HTML SCRIPT element in the webpage.
const script = document.createElement("script");
// Specify the URL to retrieve the indicated video from a feed of a current list of videos,
// as the value of the src attribute of the SCRIPT element.
script.setAttribute("src", "https://gdata.youtube.com/feeds/api/videos/" +
videos[videoIndex].Id + "?alt=json-in-script&callback=videoDetailsLoaded");
// Insert the SCRIPT element at the end of the HEAD section.
document.getElementsByTagName('head')[0].appendChild(script);
}
注:
JSONP は、従来の手法では、最新の代替手段よりもセキュリティ リスクが高くなります。 JSONP は、まだ移行できない古い統合を維持する必要がある場合にのみ使用します。 新しい開発では、CORS またはサーバー側プロキシを使用します。
関連項目
Office Add-ins