Question

I’m sick of the following problem:

I query the Facebooks API for some permissions by using the facebook function FB.api(). I want to wait for the result of this before I go on to proceed some tests etc. My aim is to create a small helper class to call often used functions by this class:

var fbHelper = {

    hasPermission: function(permission) {

            var hasPermission = false;
            var requestedPermissions = false;
            var permissions = { };

            FB.api('/me/permissions', function(response){    

                permissions = response;
                requestedPermissions = true;
                return response;
            });

            if(permissions){
                // make some checking stuff here
                return hasPermission;
            } else {
                console.log('failed to /me/permissions');
                return false;
            }        
     }
}

So i want to use fbHelper.hasPermission('dummy'). Unfortunately the if(permissions) is worked before FB.Api() is completed.
How can I achieve to wait for the rest of my code until the Api-Call is completed??

Answer 1

You can’t really write a function that executes an asynchronous request and expect to be able to reliably return the result. I would restructure your helper method as follows:

hasPermission: function(permission, callback) {

        var hasPermission = false;
        var requestedPermissions = false;
        var permissions = { };

        FB.api('/me/permissions', function(response){    

            permissions = response;
            requestedPermissions = true;
            if (permissions) {
                callback(permissions);
            } else {
                callback(false);
            }
        });     
 }

Let calling code supply a callback function to be executed when the AJAX call has completed.