1

こちらの手順に従って、クロスサイト iframe のサイズ変更を試みていますが、iframe はサイズ変更されません。何が間違っているのかわかりません。

iframe は現在http: //ayeoui.c​​om/testerpage.php にあります。これによりブログ投稿が呼び出され、メインの ayeoui.c​​om ドメインに「helper.html」ページが読み込まれます。理論上は、最初のページに情報が返され、サイズ変更がトリガーされます。メインサイトのコードには次のように書かれています。

<script>
  // Resize iframe to full height
  function resizeIframe(height)
  {
    // "+60" is a general rule of thumb to allow for differences in
    // IE & and FF height reporting, can be adjusted as required..
    document.getElementById('iframeid').height = parseInt(height)+60;
  }
</script>
<iframe id='iframeid' src='http://rinich.com/blog/11/index.html'></iframe>

リンクされたページには、次のコードが記述されています。

<body onload="iframeResizePipe()">
<iframe id="helpframe" src='' height='0' width='0' frameborder='0'></iframe>

<script type="text/javascript">
  function iframeResizePipe()
  {
 // What's the page height?
     var height = document.body.scrollHeight;

     // Going to 'pipe' the data to the parent through the helpframe..
     var pipe = document.getElementById('helpframe');

     // Cachebuster a precaution here to stop browser caching interfering
     pipe.src = 'http://www.ayeoui.com/helper.html?height='+height+'&cacheb='+Math.random();

  }
</script>

最後に、ヘルパー ページに移動します。

<html> 
<!-- 
This page is on the same domain as the parent, so can
communicate with it to order the iframe window resizing
to fit the content 
-->  
  <body onload="parentIframeResize()"> 
    <script> 
      // Tell the parent iframe what height the iframe needs to be
      function parentIframeResize()
      {
         var height = getParam('height');
         // This works as our parent's parent is on our domain..
         parent.parent.resizeIframe(height);
      }

      // Helper function, parse param from request string
      function getParam( name )
      {
        name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
        var regexS = "[\\?&]"+name+"=([^&#]*)";
        var regex = new RegExp( regexS );
        var results = regex.exec( window.location.href );
        if( results == null )
          return "";
        else
          return results[1];
      }
     </script> 
  </body> 
</html>

しかし、テスター ページはまったく変わっていません。明らかに私は何か間違ったことをしていますが、何が悪いのかわかりません。何が起こっていますか？

4

3 に答える 3

0

Uncaught SecurityError: Blocked a frame with origin "http://www.ayeoui.com" from accessing a frame with origin "http://ayeoui.com". Protocols, domains, and ports must match.

サブドメインが一致しません。http://www.ayeoui.comとは全く違いhttp://ayeoui.comます。

于 2013-08-21T18:09:13.550 に答える
-1

よくわかりませんが、これが理由である可能性があります。same origin policy error が発生しています。

Chrome の開発ツールのコンソールに次のエラーが記録されます。Uncaught SecurityError: Blocked a frame with origin "http://www.ayeoui.com" from accessing a frame with origin "http://ayeoui.com". Protocols, domains, and ports must match.

にwww.ayeoui.comアクセスするからrinich.comです。これは許可されていません (なぜですか? )。

すべてが同じドメインとの間でアクセスできるようにすることができます: ayeoui.com.

また、別の注意として、seamless属性をに追加することを検討することをお勧めしますiframe。これにより、すべてが非常にきれいに見えます（私の意見では）：

<iframe id="iframeid" src="http://rinich.com/blog/11/index.html" seamless></iframe>
于 2013-08-08T13:32:40.260 に答える