Ajax Fails After Facebook.showPermissionDialog()

Blog Projects
Facebook FBJS

Facebook developing is pretty much trial and error. Documentation has lately been improving a lot. Still there are lot of surprises. Especially with FBJS. Recently I got stuck with a problem of Ajax requests sometimes silently failing. Developer forums and Stack Overflow had the same problem but no answer.

Failing FBJS Code

First user clicks a submit button in application tab. Code will then show dialog requesting for extra permissions.

After giving the permissions code should submit form data to server. I also wanted to to receive the uid of current user. Hence the parameter ajax.requireLogin is set to true.

var form      = document.getElementById("form");
var form_data = form.serialize();

Facebook.showPermissionDialog("publish_stream", function(permissions) {

    var ajax = new Ajax();
    ajax.responseType = Ajax.RAW;
    ajax.requireLogin = true;
    ajax.ondone = function(data) {
    };
    ajax.onerror = function() {
    };

    ajax.post("http://www.example.com/submit", form_data);

    return false;
});

Code above worked just fine while developing. While doing final testing I noticed a problem. Ajax request was silently ignored when new user gave application extra permissions. If user had given permissions before or denied the permissions everything was fine. Reloading the page also fixed the problem.

Trial and Error to the Rescue!

Forcing a page reload would have been an ugly fix. After hour of hair pulling and trying other things the solution was quite simple:

    ajax.requireLogin = false;

This parameter simply asks for basic permissions. With basic permissions Facebook sends the user uid with Ajax request. We already ask publish_stream permission using a dialog. When extra permissions are given application automatically receives also the basic permissions.

Related articles: Rake Tasks For Easier Facebook Development



When asking a question include an URL to example page where the problem occurs. Even better is to make a Fiddle which demonstrates the problem. If you have longer code examples please use pastie.org.
CATEGORIES
Built using the awesome Flat UI Pro framework by Designmodo.

Mika Tuupola is a Member of the Leanpub Affiliate Program.

© 2014 Mika Tuupola.