如何在回调函数之外使用FB.api(JS SDK)响应？

Question

我没有登录甚至调用api的任何问题,我只是在api回调之外得到响应的问题.我知道它是异步运行所以我想将它放在一个可以返回响应的函数中.这是我的想法

//What I would like to be able to do
function fbUser(){
   FB.api('/me', function(response){
      //this logs the correct object
      console.log(response);
   });
//How do I get the response out here?
return response;
}

我想在开始时调用/ me api函数,然后将它传递给我的视图对象(我只是使用Backbone Views中的响应)并根据需要进行其他api调用.我目前通过从回调内部调用视图来完成某些工作

//What I am doing now, but I lose the ability to pass anything other than the 
//the current response to this function/View
FB.api('/me', function(response){
     var newView = new facebookView({model: response});
   });

我正在尝试这个,但因为api调用是异步的,所以我遇到了未定义的问题

//What I started with but had async issues
var fbResponse;
FB.api('/me', function(response){
     fbResponse = response;
   });
//I would then try and use fbResponse but it would be undefined

当我做第二个时,我失去了第一个回应.例如,我的第一个api调用是/我获取用户信息.然后我可以调用/ your-fb-id/photos并获取照片,但是如果我调用照片api回调中的另一个函数,我只能引用该响应,我丢失了原始/我的响应.如果我可以从回调中获得响应,那么我将能够根据需要传递它.我知道响应只在回调中有效,所以如何在回调之外使其有效,同时考虑到它的异步性？

Answer 1

好的每个人我都明白这一点.我花了很长时间阅读许多不同的页面.我所说的我想做的就是回调和关闭.我将首先介绍回调问题.因为FB.api函数是异步的,所以你永远不知道它什么时候会返回.你可以停止Javascript或设置一个计时器,但这是一个可怕的方法来做到这一点.你需要一个回调.实际上FB.api正在使用回调.这就是作为第二个参数的匿名函数.我所做的是创建另一个调用fbUser并使用回调的函数.这是我做的:

function startThis() {  
    var getUser = fbUser(function(model){
        console.log(model);
        startapp(model);
    }); 
};

function fbUser(callback){  
        FB.api('/me', function(response){
                callback(response);
            });
}

startThis函数在积极的Facebook身份验证响应中调用.然后它调用具有回调的fbUser函数.回调从FB.api函数返回回调.因为startThis使用该回调并且返回值被称为model,所以在回调返回之前,其他代码将不会执行.没有更多未定义的问题.这些函数只是让Facebook回应我的观点的包装器.我可能添加了太多抽象层,但是如果你想传递响应,这就是方法.

其次,我想把这个回复传递给另一个观点.例如,一个视图加载基本信息(使用来自fbUser的响应).我现在想把它传递到另一个加载照片的视图(我知道这不是MVC的最佳实践,但是通过使用Facebook我对模型没有太多控制权).我遇到的问题是我无法将原始响应传递给下一个视图,因为FB.api调用的回调函数内部this引用的是Window而不是我所在的对象.解决方案:闭包.我不会完美地解释这个,但是闭包是一个函数内部的局部变量,它仍然在匿名函数内部有一个引用.这是我的解决方案,应该说明我在说什么:

photos: function(){
            var This = this;
            var apiString = '/' + this.model.id + '/photos';
            FB.api(apiString, function(response){
                loadPhoto(response,  1, This.model);
            });

函数loadPhoto是一个加载照片视图的包装器(我知道主干可以帮助我加载不同的视图,但我一次只处理一个问题).它将照片api调用作为模型,将数字作为偏移量,以及origanl响应.此函数的第一行将此设置为局部变量This.这允许我在匿名回调函数内部引用调用它的对象.

我希望这可以帮助别人,因为我花了很多时间和大量的测试时间来找到解决方案.如果您不知道回调或闭包是如何工作的,那么很难找到您要查找的信息.