使用json拉入facebook喜欢多页

时间:2012-02-06 02:14:04

标签: jquery json facebook-graph-api

我一直在寻找一个jQuery json方法来获取给定facebook的统计数据,这是我在uni开始的项目。我发现这已经在这里被问到:trying to pull the number of likes from a facebook fanpage using JSONP and JQuery

使用了我的页面的代码,它运行良好,并且是轻量级的,但是我现在想要使用这个代码从多个页面中提取结果,但是我们试图找到一个解决方案并打了一堵砖墙。

我当前的代码,拉入一页的数据是:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    <script type="text/javascript">
      $(function() {
        //Set Url of JSON data from the facebook graph api. make sure callback is set   with a '?' to overcome the cross domain problems with JSON
        var url = "https://graph.facebook.com/immbudden?callback=?";

        //Use jQuery getJSON method to fetch the data from the url and then create our unordered list with the relevant data.
        $.getJSON(url,function(json){
            var html = "<ul><li>" + json.likes + "</li><li>" + json.about + "</li></ul>";
            //A little animation once fetched
            $('.facebookfeed').animate({opacity:0}, 500, function(){
                $('.facebookfeed').html(html);
            });
            $('.facebookfeed').animate({opacity:1}, 500);
        });
      });
    </script>
    <link rel="stylesheet" href="style.css" media="all">
</head>

<body>
    <div id="wrapper"><!--wrapper open-->
        <div class="facebookfeed">
        <h2>Loading...</h2>
    </div>
    </div><!--wrapper closed-->
</body>

我真正开始正式深入研究jQuery,所以非常感谢任何帮助!

先谢谢,迈克尔

1 个答案:

答案 0 :(得分:3)

您可以批量请求Facebook API,这样您甚至不需要为多个页面进行多次调用:)

批处理请求看起来像这样:https://graph.facebook.com/?ids=id1,id2,id3等。然后,您需要遍历结果以将其打印出来。所以整个变化都是这样的:

var url = "https://graph.facebook.com/?ids=immbudden,page2,page3&callback=?";

$.getJSON(url, function(json) {
    var html = '';

    $.each(json, function(index, item) {
        html += "<ul><li>" + item.likes + "</li><li>" + item.about + "</li></ul>";
    });

    //A little animation once fetched
    $('.facebookfeed').animate({
        opacity: 0
    }, 500, function() {
        $('.facebookfeed').html(html);
    });
    $('.facebookfeed').animate({
        opacity: 1
    }, 500);
});

我在这里为你创建了一个有效的jsFiddle:http://jsfiddle.net/rYyzf/