IE 6,7 opener hack方式により完全なドメイン間

6893 ワード

以前はプロジェクトの時、ドメイン間で大きなデータ量のデータを要求して処理する必要があったが、サービス側が提出したデータは非常に大きく、getのURL長の制限は需要を満たすことができず、ドメイン間の影響でデータ伝送の問題がずっと頭を悩ませていた.そこで、インターネットでいくつかのドメインをまたぐ解決策を探して、iframeがiframeを埋め込んで、windowを通じてにほかならない.nameやhashは、ジャンプボードを作るのにurlの長さに制限され、理想的ではありません.HTML 5では、異なるドメインのページ上で、互いにwindowを通過できるpostMessageのメッセージメカニズムが提供されていることはよく知られています.postMessage(datastring,’limitDomain’)の方式でメッセージを伝達する.トリガが必要なページにonMessageイベントを登録し、eventのdata属性はdatastringテキストを渡すことです.古いJSONに合わせてparseはjson形式のオブジェクトを完璧に伝えることができます.残念なことに、現在のPostMessageはIE 8、FF、Chromeの現バージョンでのみ実現されています.古いバージョンのIE 6,7では実装されていません.
そこでGoogleで検索すると、ある高人のBlogがIE 6,7 opener hackという方法でドメイン間を実現しているのを何気なく発見し、Googleのエンジニアが率先して発見したこのバグだそうで、fackbookのログインページはこのバグを利用してpostMessageを実現したドメイン間を実現しているそうです.
残念なことに、googleは長い間、詳細な資料がほとんど見つからず、具体的な例も見つからなかったので、自分で手伝って、例を書いて、置いてきました.
次に、このバグをどのように利用するかの例を見てみましょう.
hosts構成
   1: 127.0.0.1    www.a.com
   2: 127.0.0.1    www.b.com

test.htm
   1: <html>
   2: <body>
   3: <iframe id="a" src="http://www.b.com/test1.htm"></iframe>
   4: <script>
   1:  
   2: var i=document.getElementById('a');
   3: i.contentWindow.opener={
   4:     dd:function(str){
   5:         var div=document.createElement('div');
   6:         document.body.appendChild(div);
   7:         div.innerHTML=str;
   8:     }
   9: }
  10: setTimeout(function(){
  11:     opener.bb('bbbbbbb');
  12: },300)
  13:  
   5: </body>
   6: </html>

test1.htm
   1: <html>
   2: <body>
   3:  
   4: <script>
   1:  
   2:     window.opener.dd('aaaaaaaaa');
   3:     parent.opener={
   4:         bb:function(str){
   5:             var div=document.createElement('div');
   6:             document.body.appendChild(div);
   7:             div.innerHTML=str;
   8:         }
   9:     }
   5: </body>
   6:  
   7: </html>

http://www.a.com/test.htmを すると が されます
IE 6,7では,windowオブジェクトをリセットしたopenerが{}オブジェクトである り, ページにiframeのwindowが されていることがわかる.Openerが{}になると、iframeではopenerでparentを び す でiframeでparentをリセットできます.Openerが{}オブジェクトの 、parentでiframeのメソッドを び すことができます.
*Openerをfunction(){}に し、new opener()で び すという もあります
まとめて、IE 6,7のhackを じて、postMessageの ブラウザでの を に に することができて、 でドメインをまたいでまた1つの を くしました.でも なことに、openerをリセットした 、windowに して.Openが いているウィンドウは、IE 6,7でうまく できません.