Facebook Javascript SDK rerequest permissions doesn't prompt

Question

Haven't been able to solve this since my last go, but I restructured the code after this https://developers.facebook.com/blog/post/576/

I can't trigger the re-request for accepting all the permissions (ignore the alert text content as that will change to tell the user about why the permission are needed)

Here's the sign in code

jQuery(function() {
  $('body').prepend('<div id="fb-root"></div>');
  return $.ajax({
    url: "" + window.location.protocol + "//connect.facebook.net/en_US/all.js",
    dataType: 'script',
    cache: true
  });
});

window.fbAsyncInit = function() {
  return FB.init({
    appId: '<%= ENV["FACEBOOK_KEY"] %>',
    cookie: true
  });
};


var permsNeeded = ["email", "user_birthday", "user_friends"];

var checkPermissions = function() {
  var promptForPerms;
  FB.api("/me/permissions", function(response) {
    var i, permsArray, permsToPrompt;
    permsArray = response.data[0];
    permsToPrompt = [];
    for (i in permsNeeded) {
      if (permsArray[permsNeeded[i]] == null) {
        permsToPrompt.push(permsNeeded[i]);
      }
    }
    if (permsToPrompt.length > 0) {
      alert("Need to re-prompt user for permissions: " + permsToPrompt.join(","));
      promptForPerms(permsToPrompt);
    } else {
      alert("No need to prompt for any permissions");
    }
  });

  promptForPerms = function(perms) {};
  FB.login((function(response) {
    console.log(response);
  }), {
    scope: perms.join(","),
    auth_type: "rerequest"
  });

$("#sign_in").click(function(e) {
    e.preventDefault();
    return FB.login((function(response) {
      if (response.authResponse) {
        checkPermissions();
      }
    }), {
      scope: permsNeeded.join(',')
    });
  });
};

Any suggestions on what to modify or change? I'm totally stuck on what to do. Right now, nothing alerts regardless of what you deny or permit.

Answer 1

@Jeff Caspian

This is the exact right way to get user email address, thanks a lot I was nearly struck for 2 days. Actually lot of them are reporting as bug to Facebook team that they are not able to get email address in fact me too.

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

}

This is the call which saved me thanks again.

Answer 2

Seems like there are some bugs in your code. I highly recommend you to format and style your code properly.

I have fixed the bugs and you may refer to the revised code below.

Note that this is using facebook jssdk v2.2.

window.fbAsyncInit = function() {
  FB.init({
    appId      : '960839450617376',
    xfbml      : true,
    version    : 'v2.2'
  });
  init();
};

(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";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));

function init() {
  var permsNeeded = ["email", "user_birthday", "user_friends"];

  var checkPermissions = function() {
    var promptForPerms;
    FB.api("/me/permissions", function(response) {
      var permsArray, permsToPrompt;
      permsArray = response.data;
      permsToPrompt = [];
      console.log(JSON.stringify(permsArray));
      for (var i = 0, ilen = permsArray.length; i < ilen; i++) {
        console.log(permsArray[i].permission, permsArray[i].status);
        if (permsNeeded.indexOf(permsArray[i].permission) != -1 && permsArray[i].status != 'granted') {
          permsToPrompt.push(permsArray[i].permission);
        }
      }
      console.log(permsToPrompt);
      if (permsToPrompt.length > 0) {
        alert("Need to re-prompt user for permissions: " + permsToPrompt.join(", ") + '.\nPlease try again and allow the permission mentioned.');
      } else {
        alert("No need to prompt for any permissions");
      }
    });

  };
  $("#sign_in").click(function(e) {
    console.log('sign in');
    e.preventDefault();
    return FB.login(
      function(response) {
        if (response.authResponse) {
          checkPermissions();
        }
      }, {
        scope: permsNeeded.join(','),
        return_scopes: true,
        auth_type: 'rerequest'
      }
    );
  });
}

As you can see I have changed permsArray = response.data[0]; => permsArray = response.data;

This is because when I request the list of permission I receive the following json example

{
  data: [
    {
      "permission":"public_profile",
      "status":"granted"
    },
    {
      "permission":"email",
      "status":"granted"
    },
    {
      "permission":"user_birthday",
      "status":"granted"
    },
    {
      "permission":"user_friends",
      "status":"granted"
    }
  ]
}

I have also edited the loop to check which permission is denied.

Instead of reprompting login via code, we request user to click the sign in button again so that the login popup will be allowed (via click event).

I have also set auth_type: 'rerequest' as default for the login request since I do not see any prompt for permission if all permission is granted.