0

これはコードよりもタイミングに関係していると思うので、実際には、JSON応答を取得するための最良の方法に関するベストプラクティスのアドバイスを探しています。

<script type="text/javascript">

            $(window).load(function() {
                $('#messages').append('<img src="images/loading.gif" alt="Currently Loading" id="loading" />');

                var ideaid = <?php echo $_GET['ideaid']; ?>;
                $.ajax({

                    url: 'sql/ajaxsql.php',
                    type: 'POST',
                    data: 'switch=commentList&ideaid=' + ideaid + '&filter=sortdate',
                    dataType: 'json',

                    success: function(result) {
                        var len = result.length;
                        var html;
                        console.log('length= ' + len);
                        $('#response').remove();
                        console.log(result);
                        for(var i = 0; i < len; i++) {
                            var pic = '<img src="https://graph.facebook.com/' + result[i].user_id + '/picture&type=small" align="middle" />';
                            var authname;
                            FB.api('/' + result[i].user_id + '?fields=name', function(AuthName) {
                                console.log(AuthName);
                                alert(AuthName.name);
                               authname = AuthName.name;

                            });
                            html = '<p>' + result[i].comment + '<br><hr>Date Added: ' + result[i].date + ' by ' + pic + ' ' + authname + '<br><hr><hr></p>';
                            $('#comms').append(html);

                        }

                        $('#loading').fadeOut(500, function() {
                            $(this).remove();

                        });
                    }
                });

                return false;
            });

        </script>

このコードを使用すると、特定のアイデア（idea_id）に関するコメントを取得するために起動します。コメントにはユーザーID（facebook）のみが含まれます。すべてのデータが戻ってきたら、成功すると、画面に印刷できるようにデータが並べ替えられます。

成功の一環として、各コメントの下に著者情報の一部として日付、時刻、FB画像、名前を記載しています。

日付と時刻、動作します。グラフを使用した画像は機能しますが、名前はウィンドウの読み込みより少し遅れているため、呼び出しを逃しているため、未定義として返され、アラートが名前とともにポップアップ表示されます。私はajaxがこれを行うことを意図していることを理解しています。

これを回避するための最良の方法は何ですか。

前もって感謝します。

アンドリュー

編集

以下の提案があっても、私はこの仕事をすることができませんでした。

もう一度編集してくださいちょうど以下のようにbfの新しい更新されたバージョンを見ました。また働いていただろう。しかし、私はこの1つの機能に一日を費やし、あえてプレイしないようにしました。

FB.apiが機能するようになるとすぐに、その外部から値を取得できませんでした。だから私は別のアプローチを取りました。

ajaxではなく、uidを含むデータを取得するPHP側からのクエリを使用し、jsonがそれをクエリして、次のように（mysql_fetch_array）配列にボルトで固定しました。

         $gc_result = mysql_query($gc_query);
    while ($result = mysql_fetch_array($gc_result)) {
        $jsonURL = "https://graph.facebook.com/" . $result['user_id'] . "/";
        $json = json_decode(file_get_contents($jsonURL), true);
        $result["name"] = $json['name'];

        $data[] = $result;
    }

    echo json_encode($data);

これで、次の操作を実行して、jQuery内で呼び出すことができます。

for(var i = 0; i < len; i++) {
    var pic = '<img src="https://graph.facebook.com/' + result[i].user_id + '/picture?type=small" align="middle" />';
     html = '<p>' + result[i].comment + '<br><hr>Date Added: ' + result[i].date + ' by ' + pic + ' ' + **result[i]['name']** + '<br><hr><hr></p>';
     $('#comms').append(html);  
                        }

これはすべてうまく機能し、私はjqueryのプログラミングとFacebook APIとJSONの使用の完全な初心者ですが、私でさえこのソリューションにかなり感銘を受けています。私が夢中になる前に、これ、パフォーマンス、またはセキュリティの面で潜在的な欠陥はありますか？

よろしくお願いします。

アンドリュー

4

2 に答える 2

2

の呼び出しFB.apiはおそらく非同期（別のajaxリクエスト）であるため、コードをFB.apiコールバック内に移動する必要があります。

FB.api('/' + result[i].user_id + '?fields=name', function(AuthName) {
    console.log(AuthName);
    alert(AuthName.name);
    authname = AuthName.name;
    html = '<p>' + result[i].comment + '<br><hr>Date Added: ' + result[i].date + ' by ' + pic + ' ' + authname + '<br><hr><hr></p>';
    $('#comms').append(html);
});

forループが原因で、可変スコープの問題も発生します。これを修正する方法の1つは、別の関数を使用してコールバックを作成することです。$(window).loadブロックの直後、前にこれを追加します</script>：

function createFbApiCallback(jsonResult) {
    return function(AuthName) {
        var authname = AuthName.name;
        var pic = '<img src="https://graph.facebook.com/' + jsonResult.user_id + '/picture&type=small" align="middle" />';
        var html = '<p>' + jsonResult.comment + '<br><hr>Date Added: ' + jsonResult.date + ' by ' + pic + ' ' + authname + '<br><hr><hr></p>';
        $('#comms').append(html);
    }
}

次に、ループを次のように変更します。

for(var i = 0; i < len; i++) {
    FB.api('/' + result[i].user_id + '?fields=name', createFbApiCallback(result[i])); 
}
于 2012-05-11T21:36:28.583 に答える
0

別のコールバック関数内のコールバック関数に依存するコードを実行する必要がある場合は、最も内側のコールバック関数内でコードを実行します。あなたの場合、FB APIコールバックの外にあるものをすべてその中に移動して、すべてのDOM操作がAJAX応答とFB.api応答の両方が返されたときにのみ実行されるようにします。

于 2012-05-11T21:38:13.900 に答える