iframeのクロスドメインの高さを取得する方法

Question

facebook、twitterなどからsrcとiframe（クロスドメイン）を持っています。iframeの高さを取得する必要がありますが、問題があります： "プロパティ 'ドキュメント'にアクセスする権限が拒否されました。これを解決するために私を助けてください。どうもありがとう！

Answer 1

カップルの問題。まず、iframeの高さは、あなたが望むものではない可能性があります。私は、あなたがコントロールするページのHTMLコードに明示的に設定されており、どのJavaScriptメソッドを介しても簡単にアクセス可能で変更可能であることを意味します。それがあなたの後ろにあるのはページの高さですの内側に iframeです。そうであれば、少なくともFacebook/Twitterのような外部サービスではできないという簡単な答えはありません。

の両方のJavaScriptのに通信経路が組み込まれていない限り、セキュリティ上の理由から、親から子へのメッセージは簡単に渡すことができます。現代のブラウザでこれを処理するためのプロトコルはpostMessageです。 https://developer.mozilla.org/en/DOM/window.postMessage。しかし、このケースでは、通信しているドキュメントが、受信したpostMessageを処理するようにセットアップされていない限り、この場合はまったく役に立たないです。私の知る限りでは、Twitter/Facebookは頻繁にそうではありません。

親文書が異なるドメインの子どもと自由に通信できる場合、 JavaScriptはログインしているすべてのサイトで一連のコマンドを効果的に実行できます。そのセキュリティの意味は恐ろしく、ありがたいことには不可能です。

Answer 2

クロスドメインのiframeの高さを調べるにはjavascriptのオプションはありませんが、サーバー側のプログラミングの助けを借りてこれを行うことができます。この例ではPHPを使用しました

<?php 
$output = file_get_contents('http://yourdomain.com'); 
?> 
<div id='iframediv'> 
    <?php echo $output; ?> 
</div> 

<iframe style='display:none' id='iframe' src="http://yourdomain.com" width="100%" marginwidth="0" height="100%" marginheight="0" align="top" scrolling="auto" frameborder="0" hspace="0" vspace="0"> </iframe> 

<script> 
if(window.attachEvent) { 
    window.attachEvent('onload', iframeResizer); 
} else { 
    if(window.onload) { 
     var curronload = window.onload; 
     var newonload = function(evt) { 
      curronload(evt); 
      iframeResizer(evt); 
     }; 
     window.onload = newonload; 
    } else { 
     window.onload = iframeResizer; 
    } 
} 
    function iframeResizer(){ 
     var result = document.getElementById("iframediv").offsetHeight; 

     document.getElementById("iframe").style.height = result; 
     document.getElementById("iframediv").style.display = 'none'; 
     document.getElementById("iframe").style.display = 'inline'; 
    } 
</script>