8

このように、他のドメインを許可するように"Error: Permission denied to access property 'document'"既に定義している間に、エラーが継続的に発生します..X-FRAME options

 <?php
        header('X-Frame-Options: ALLOW-FROM http://mydomain.com'); 
    ?>

以下はiframeリクエストのヘッダーです。ドメインがiframeにアクセスできるように定義したが、機能していないことを明確に示しています。私が望むのは、JavaScriptを使用してiframeのサイズを変更することだけです。

ここに画像の説明を入力

iframe の高さを変更するための JavaScript コードを次に示します。

<iframe src="http://mydomain.com/xxx/yyy" id="idIframe" onload="iframeLoaded();" allowtransparency="true" frameborder="0" width="100%" scrolling="no"></iframe>
<script type="text/javascript">
function iframeLoaded() {
    var iFrameID = document.getElementById('idIframe');
    if(iFrameID) {
          iFrameID.height = "";
          if(iFrameID.contentWindow.document.body.scrollHeight < 500) {
              iFrameID.height = "500px";
          } else {
              iFrameID.height = iFrameID.contentWindow.document.body.scrollHeight + "px";
          }
    }   
}
</script>

これどうやってするの?提案してください。

4

3 に答える 3

20

私はごく最近、この問題を自分で抱えていました。最後に、postMessage メソッドで解決しました。

  1. iFrame に含まれるドキュメントで、実際に iFrame から実行されているかどうかを確認します。

    function inIframe(){
        if(top != self){
             var contentHeight = $('#myIframeContent').height(); //Just this part I did with jQuery as I was sure that the document uses it
             postSize(contentHeight);
             }
        }
    
  2. ドキュメントが iFrame 内で実行されている場合は、postSize を呼び出す関数を呼び出します。

    function postSize(height){
         var target = parent.postMessage ? parent : (parent.document.postMessage ? parent.document : undefined);
    
        if(typeof target != "undefined" && document.body.scrollHeight){
            target.postMessage(height, "*");
            }
        }
    
  3. iFrame を含むドキュメントに次のコードを追加します。

    function receiveSize(e){
        if(e.origin === "http://www.mywebsite.net"){
            var newHeight = e.data + 35;
            document.getElementById("myIframeID").style.height = newHeight + "px";
            }
        }
    
    window.addEventListener("message", receiveSize, false);
    

残念ながら、ここStackoverflowでさまざまなソリューションだけでなく、さまざまなWebサイトを見ていたため、これらすべての正確なソースを思い出すことはできません. しかし、この解決策は私にとってはうまくいきます。

乾杯

于 2014-03-18T14:12:19.200 に答える