2

サービス用に OAuth API を実装しており、アプリケーションもサポートする予定です。

私がやりたかった最初のこと-アプリのiframeの自動サイズ変更を許可します。

立ち往生。

  • 親ドキュメントでは、iframe が他のドメインにある場合、iframe コンテンツのサイズを取得できません。
  • iframe が他のドメインにあるため、iframe から親ドキュメント/スクリプトを操作できません。

しかし、Facebookはどういうわけかそれをしますか??

アプリの読み込みフローをハックしようとしましたが、成功しませんでした。

それらは iframe に page_proxy.php をロードし、何らかの方法でアプリケーションからのコードがその iframe 内に入ります。

もちろん、単にアプリから html コンテンツを取得し、すべての URL パスを絶対パスに変換することもできます..しかし。では、Ajax 呼び出しはどのように機能するのでしょうか (単に html コンテンツをロードしている場合、どの ajax 呼び出しもクロスドメイン呼び出しになります)。しかし、私のアプリが実際の iframe としてロードされ、クロスドメイン呼び出しがないかのように、すべて FB で動作します..! しかし、もう一度..サイズ変更の仕組みと、Facebookでiframeが表示されず、pageproxyのみが表示されるのはなぜですか??

ここには本当に光が必要です。

ありがとう。

4

1 に答える 1

3

最終的にFBがそれを行う方法を見つけました:)

  • page_proxy.php#frameName - フォームをロードし、POST メソッドを使用して署名付きリクエストで iframe をロードします。

アプリでiframeをロードするための直接呼び出しがないのはなぜですか? サードパーティのスクリプトが署名付きリクエスト (すべてのユーザー情報を含む) を取得するのを防ぐため。

fbのやり方（私が採用したコード）：

<form method="post" id="proxy_form"><input type="hidden" autocomplete="off" id="signed_request" name="signed_request" /></form>
<script>
  var frameName = window.location.href.split('#')[1];
  function submitForm(appTabUrl, signedRequest) {
    var proxyForm = document.getElementById("proxy_form");
    proxyForm.setAttribute("action", appTabUrl);
    proxyForm.setAttribute("target", frameName);
    var input = document.getElementById("signed_request");
    input.setAttribute("value", signedRequest);
    proxyForm.submit();
  }
  function waitForParams() {
    submitForm('$url_with_app', 'signed_request_goes_here');
  }
  waitForParams();</script>

  • iFrame のアプリは正常に読み込まれますが、POST 要求を使用して読み込まれるため、DOM ブラウザーにアプリの iframe が表示されません。

  • アプリで facebook を初期化し、アプリを Autogrow に指示します。

  • Facebook の初期化が完了し、DOM の準備が整うまで待って、アプリの高さを計算します。

  • ここで、iframe を拡張します。そして、これが彼らが行うトリックです：

FBからのソース

_sendMessageToFacebook: function(message) {
    var url = FB._domain.staticfb + 'connect/canvas_proxy.php#' +
      FB.QS.encode({method: message.method,
                    params: FB.JSON.stringify(message.params)});

     var root = FB.Content.appendHidden('');
     FB.Content.insertIframe({
       url: url,
       root: root,
       width: 1,
       height: 1,
       onload: function() {
         setTimeout(function() {
           root.parentNode.removeChild(root);
         }, 10);
       }
     });
  }

アプリケーション内に別の iframe をロードしますが、その iframe は既に facebook に属しており、FB の親 (上部ウィンドウ) とやり取りして、必要なすべての情報を親に送信できます!

于 2013-04-03T08:40:44.973 に答える