查询Facebook Javascript SDK中的Asynchrone查询

Question

我正在尝试在我的网站上显示特定页面的facebookposts。

<script>
      window.fbAsyncInit = function() {
        FB.init({
          appId      : 'xxx',
          xfbml      : true,
          version    : 'v2.3'
        });
        var access_token;
        FB.getLoginStatus(function (response) {
            if (response.authResponse) {
                $('#AccessToken').val(response.authResponse.accessToken);
                access_token = response.authResponse.accessToken;
                FB.api('/yyy/posts?metadata=1&access_token=' + access_token, function(response) {           
            var text = "";
            var count = 0;

            response.data.forEach(function(element, index, array)
            {
                if(count<3)
                {
                    text = text + "<div id=\"fbpost\">";
                    if(typeof element.picture != "undefined")
                    {
                        text = text+ "<center><img src=\"" + element.picture + "\"></img></center><br>";
                    }
                    text = text+ element.message + "<br>"
                    text = text + element.created_time + "<br>";
                    text = text + "</div>";
                    console.log(element);
                }
                count++;
            });
            text = text + "<div id=fbpostClose></div>"
            console.log(text);
            document.getElementById("demo").innerHTML = text;
        });

            } else {
                // do something...maybe show a login prompt
            }
        });
      };

      (function(d, s, id){
         var js, fjs = d.getElementsByTagName(s)[0];
         if (d.getElementById(id)) {return;}
         js = d.createElement(s); js.id = id;
         js.src = "//connect.facebook.net/en_US/sdk.js";/*sdk.js*/
         fjs.parentNode.insertBefore(js, fjs);
       }(document, 'script', 'facebook-jssdk'));          

    </script>

这就像一个魅力。除了一件事，你得到的图片只有一张图片，分辨率非常小。

我在another stackoverflow-question上找到了你可以通过object_id查询帖子所属的图片：

   FB.api('/' + element.object_id + '?fields=images', function(responseimage) 
   {    
        console.log(responseimage);
        responseimage.images.forEach(function(image, index2, array2)
        {
            console.log(image.source);
            text = text + image.source;
            text = text + "<center><img src=\"" + image.source + "\"></img></center><br>";
        });                             
    });

我想在代码中添加它，但它不显示图像。我认为由于异步调用，所以这个函数不会阻塞底层方法，因此它会在添加图像之前显示变量文本。

我尝试了以下代码：

<script>
      window.fbAsyncInit = function() {
        FB.init({
          appId      : 'xxx',
          xfbml      : true,
          version    : 'v2.3'
        });
        var access_token;
        FB.getLoginStatus(function (response) {
            if (response.authResponse) {
                $('#AccessToken').val(response.authResponse.accessToken);
                access_token = response.authResponse.accessToken;
                FB.api('/yyy/posts?metadata=1&access_token=' + access_token, function(response) {           
            var text = "";
            var count = 0;

            response.data.forEach(function(element, index, array)
            {
                if(count<3)
                {
                    text = text + "<div id=\"fbpost\">";
                    if(typeof element.picture != "undefined")
                    {
                        text = text+ "<center><img src=\"" + element.picture + "\"></img></center><br>";
                        FB.api('/' + element.object_id + '?fields=images', function(responseimage) 
                        {
                            console.log(responseimage);
                            responseimage.images.forEach(function(image, index2, array2)
                            {
                                console.log(image.source);
                                text = text + image.source;
                                text = text + "<center><img src=\"" + image.source + "\"></img></center><br>";
                            });                             
                        });
                    }
                    text = text+ element.message + "<br>"
                    text = text + element.created_time + "<br>";
                    text = text + "</div>";
                    console.log(element);
                }
                count++;
            });
            text = text + "<div id=fbpostClose></div>"
            console.log(text);
            document.getElementById("demo").innerHTML = text;
        });

            } else {
                // do something...maybe show a login prompt
            }
        });
      };

      (function(d, s, id){
         var js, fjs = d.getElementsByTagName(s)[0];
         if (d.getElementById(id)) {return;}
         js = d.createElement(s); js.id = id;
         js.src = "//connect.facebook.net/en_US/sdk.js";/*sdk.js*/
         fjs.parentNode.insertBefore(js, fjs);
       }(document, 'script', 'facebook-jssdk'));          



    </script>

我找不到任何关于使用Facebook Graph Api加入查询的内容。