Question

This function is working on Chrome and Firefox but not on IE9, where errorHandler is logging this error message:

ERROR:  getFriendsArray {"readyState":0,"status":0,"statusText":"No Transport"}

getUserAccessToken() is returning the right value. Any ideas what could it be, that only affects IE?

EDIT: seems that https://graph.facebook.com/me/friends directly on IE browser returns HTTP 400 error.

function getFriendsArray() {

    var friendsArray = [];

    $.ajax({                                      
        url: 'https://graph.facebook.com/me/friends',
        data: {
            access_token: getUserAccessToken(),
            fields: 'name,picture,gender'
        },
        dataType: 'json',
        cache: true,
        async: false,
        success: function(response) {
            var data = '';
            $.each(response.data, function(indice, item) {
                friendsArray.push(item);
            });                       
        },
        error: function(err) {
            errorHandler('getFriendsArray', JSON.stringify(err));
        }
    });

    return friendsArray.sort(sortByName);   
}

Answer 1

$.ajax only supports using XMLHttpRequest or XDomainRequest (IE), the latter only supporting a few scenarios, and requiring that your page is SSL if the requested resource is SSL.

Instead, use FB.api, which handles this and much more, ensuring that the call makes it through, either by using JSONP, XHR, XDomainRequest, or Flash.