Question

Below code gives me an ‘undefined’ on the name and email. However the user IS logged in because I DO have the access token and UID?

function getToken(){
    FB.login(function(response) {
        if (response.authResponse) {
            var access_token = response.authResponse.accessToken;
            var uid = response.authResponse.userID;
            document.getElementById('accessToken').value=access_token;
            document.getElementById('uid').value=uid;
            FB.api('/me', function(response) {
                console.log('Good to see you, ' + response.name + '.' +response.email);
            });
            document.forms['token'].submit();
        } else {
            return false;
        }
    }, {scope:'email,user_likes,friends_likes'});
}

When I output the complete response of fb.api to console I get

[11:46:10.369] ({error:"load-error: unknown"})

Answer 1

I now see what you are trying to do and the problem.

Why it fails:

You are making an asynchronous request (using the FB.api method) and then submit a form (and it’s a guess since you did not include all code) which reloads the entire page, messing up with the async request.

As for how to solve the problem:

The best solution, in my opinion, is to use the Server-Side authentication process and only then, afterwards, when the canvas loads use the client side sdk.
That way you’ll have access tokens both in the client and server side.

Another approach is not to submit the form, but to issue a ajax request to your server (it can be in POST) with the access token, since both the requests will be asynchronous (FB.api and the one to your server) everything should be a ok.