PHPはクロスサブドメインの問題を解決します：document.domainとiframeを使用してデータ通信を達成する

gitbox 2025-06-30

導入

クロスドメインは、フロントエンド開発において一般的な問題です。ブラウザの相同ポリシーの制限により、クロスドメインの要求は通常ブロックされ、開発者に特定の課題をもたらします。ただし、特定のシナリオでは、異なるサブドメイン間でデータ通信を実装する必要があります。この記事では、document.domainおよびiframeテクノロジーの使用方法を紹介して、クロスサブドメイン通信の問題を解決します。

document.domainの役割

特定のソリューションに飛び込む前に、まずdocument.domainの役割を理解しましょう。 document.domainは、現在のドキュメントのドメイン名を指定する文字列プロパティです。ページのURLが「http://www.example.com」の場合、document.domain = "emple.com"を設定して、ページのドメイン名を「Example.com」に変更することができます。

解決

document.domainを設定します

まず、データ通信のためのトランジットステーションとして機能するメインドメイン名の下で親ページを作成します。サブドメインの一貫性を維持するには、document.domainを設定する必要があります。特定の手順は次のとおりです。

 //親ページ（http://www.example.com）
document.domain = "emple.com";

次に、メインドメイン名の下にiframeを作成し、サブドメイン名の下にページをロードします。

 //親ページ（http://www.example.com）
<iframe src="http://sub.example.com/child.html"></iframe>

サブドメインページ設定document.domain

サブドメインページ、Document.domainは、親と子のドメイン間の通常の通信を確保するために、メインドメイン名として設定する必要もあります。特定の操作は次のとおりです。

 //サブドメイン名前ページ（http://sub.example.com/child.html）
document.domain = "emple.com";

クロスドメイン通信を実装します

サブドメインページでは、window.parentオブジェクトにアクセスして、親ページのグローバル変数とメソッドを取得できます。これを利用して、サブドメインページの親ページにリクエストを積極的に送信して、サブドメイン全体で通信できます。コードは次のとおりです。

 //サブドメイン名前ページ（http://sub.example.com/child.html）
var parentWindow = window.parent;
ParentWindow.PostMessage（ "Hello、Parent Page！"、 "http://www.example.com"）;

親ページでは、メッセージイベントを聞いて、子ページから送信されたメッセージを受信できます。コードの例は次のとおりです。

 //親ページ（http://www.example.com）
window.addeventlistener（ "message"、function（event）{
    console.log（ "サブページから受信したメッセージ：" + event.data）;
}、 間違い）;

注意すべきこと

このソリューションは、親と子のドメインが同じであり、親と子のドメインが同じでない場合、クロスサブドメイン通信が実装されない場合にのみ適しています。
このソリューションを使用する場合、クロスサイトスクリプト攻撃（XSS）などのセキュリティの問題を回避するために、データセキュリティに特別な注意を払う必要があります。

要約します

document.domainとiframeを組み合わせることにより、サブドメイン全体でデータ通信を実装できます。この方法は、親ドメインやチャイルドドメインと同じシナリオに適しており、開発者が横断症によって引き起こされる問題を解決するのに役立ちます。実装プロセス中、開発者はセキュリティに特別な注意を払い、潜在的なセキュリティの脆弱性を回避する必要があります。このようにして、クロスドメインの問題をより効率的に処理できます。