免責事項: 私が求めていることを説明するために最善を尽くしますが、クロスドメイン ポリシーに関する知識はかなり限られています。スタックを検索しましたが、見逃した回答があれば教えてください。
標準のFacebook Like/Send ボタンをサイトに実装しました。LikeボタンとボタンはSend、facebook.com を指す iFrame 内にあります。
ボタンをクリックするとSend、HTML が Facebook iFrame の兄弟として (つまり、DOM に) 追加されます。
私が知りたいのは、クロスドメイン ポリシーに違反することなく、FB がどのようにして私たちのサイトの div に HTML を追加できたのかということです。
これが私のフィドルです。何が起こっているかを確認するには、 をクリックしながら DOM を調べますSend。
答えを教えてくれた@CBroeに感謝します：
モジラ経由
window.postMessageクロスオリジン通信を安全に有効にする方法です。通常、異なるページ上のスクリプトは、スクリプトを実行したページが同じプロトコル (通常は両方とも http)、ポート番号 (http のデフォルトは 80)、およびホスト (モジュロ) を持つ場所にある場合にのみ、相互にアクセスできます。 document.domain は両方のページで同じ値に設定されています)。window.postMessage は、適切に使用すると安全な方法でこの制限を回避するための制御されたメカニズムを提供します。
iframeではなくjavascriptで送信ボタンを追加するためです。ページの読み込み中/読み込み直後に iframe が生成されます。
この理由から、スクリプトはあなたと Iframe のコンテンツと DOM 要素にアクセスして編集することができます。ご存じのとおり、iframe はとにかくその親に到達できません。