2

ページのタブとして使用するアプリケーションを作成しました。
コンテンツが長すぎるため、スクロールバーがないようにiframeの高さを設定する必要があります。
私の問題は、Chromeなどでは正常に動作しますが、Firefoxでは正常に動作しないことです。
これが私がしたことです：

<?php
    $signed_request = $_REQUEST["signed_request"];
    list($encoded_sig, $payload) = explode('.', $signed_request, 2);
    $data = json_decode(base64_decode(strtr($payload, '-_', '+/')), true);
?>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

    <style type="text/css">
      * {
            padding:0; margin:0; border: none; outline:none
        }
    </style>

</head>
<body style="width:520px; overflow:hidden">
<?php
     if (empty($data["page"]["liked"])) {
        echo "<img src=\"img/blur.jpg\" />";
    }
    else {
        echo "<img src=\"img/fan.jpg\" />";
    }
?>
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
    FB.init({
    appId : 'xxx_app_id',
    status : true,
    cookie : true,
    xfbml : true
});
</script>
<script type="text/javascript">
    window.fbAsyncInit = function() {
         FB.Canvas.setSize({ width: 520, height: 3591 });
    }
    function sizeChangeCallback() {
        FB.Canvas.setSize({ width: 520, height: 3591 });
     }
</script>
</body>
</html>

さらに、まったく同じアプリを3〜4回実行して動作したので、表示する画像を変更しただけです。
Firebugコンソールを見ると、エラーは見られず、適用されたcssを（Firebugから）確認すると、iframe800pxの高さがわかります。

4

1 に答える 1

1

どうやらfbAsyncInitが呼び出されなかったようですので、次のように手動でメソッドを呼び出すことで問題を修正しました。

<script type="text/javascript">
    window.fbAsyncInit = function() {
         FB.Canvas.setSize({ width: 520, height: 3591 });
    }
    function sizeChangeCallback() {
        FB.Canvas.setSize({ width: 520, height: 3591 });
    }
    window.fbAsyncInit();
</script>

これですべてが正常に機能します。
なぜこれがffでのみ、このアプリケーションでのみ発生するのかについて誰かが何か手がかりを持っている場合（質問で言ったように、正確なアプリを3〜4回作成しました-異なる画像とテキストで-）ここで共有していただければ幸いです..。。

于 2011-10-24T09:33:27.677 に答える