No callback with FB.ui

Question

I can't get the Facebook UI callback to run. I've used the example from the FB dev site:

https://developers.facebook.com/docs/reference/dialogs/feed/

FB.init({appId: "YOUR_APP_ID", status: true, cookie: true});

function postToFeed() {

    // calling the API ...
    var obj = {
      method: 'feed',
      redirect_uri: 'YOUR URL HERE',
      link: 'https://developers.facebook.com/docs/reference/dialogs/',
      picture: 'http://fbrell.com/f8.jpg',
      name: 'Facebook Dialogs',
      caption: 'Reference Documentation',
      description: 'Using Dialogs to interact with users.'
    };

    function callback(response) {
      document.getElementById('msg').innerHTML = "Post ID: " + response['post_id'];
    }

    FB.ui(obj, callback);
}

When I run it on my site I get no callback https://www.ipassexam.com/page/fb-test

Any insight would be appreciated.

Answer 1

Try to set display attribute with "popup" with the request as below:

FB.ui({
    method: 'feed',  
    link: "http://...",
    name: "Some Title",
    caption: "Some Caption",
    description: "Some Description",
    display: "popup",
    picture: "http://..."
}, function(response) {
    if (response && response.post_id) {
        alert('Post was published.');
    } else {
        alert('Post was not published.');
    }
});

I have encountered this issue inside the FB canvas page when I tried to post using feed method and I always got the "undefined" response. I have tried the above attribute and now it is working.

Answer 2

Spent 2 hours figuring the problem and the solution is, mention the display property (popup in my case).

function postToFeed() {

// calling the API ...
var obj = {
  method: 'feed',
  **display: 'popup',**
  link: 'https://developers.facebook.com/docs/reference/dialogs/',
  picture: 'http://fbrell.com/f8.jpg',
  name: 'Facebook Dialogs',
  caption: 'Reference Documentation',
  description: 'Using Dialogs to interact with users.'
};

function callback(response) {
  document.getElementById('msg').innerHTML = "Post ID: " + response['post_id'];
}

FB.ui(obj, callback);

}

Tip: redirect_uri is not mandatory if display is explicitly specified as popup.

Answer 3

try to add this before FB.init

window.fbAsyncInit = function() { //put FB.init here }

 (function(d){
   var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
   if (d.getElementById(id)) {return;}
   js = d.createElement('script'); js.id = id; js.async = true;
   js.src = '//connect.facebook.net/en_US/all.js';
   ref.parentNode.insertBefore(js, ref);
 }(document));

so that it will became like this

window.fbAsyncInit = function() {
 FB.init({appId: "YOUR_APPID", status: true, cookie: true});
};

(function(d){
   var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
   if (d.getElementById(id)) {return;}
   js = d.createElement('script'); js.id = id; js.async = true;
   js.src = '//connect.facebook.net/en_US/all.js';
   ref.parentNode.insertBefore(js, ref);
 }(document));

Answer 4

It might be not your case, but I was looking for a reason of a similar behaviour almost a week and finally I have found that FB.ui was trying to create the iframe to display on the page and for this was creating this iframe under div with id=fb-root. Unfortunately, this div was inside another div which I myself made invisible! So - to cut the long story short - check if you have div with id=fb-root and if this div is visible

Answer 5

Get rid of the redirect_uri parameter. This works for me every time:

FB.ui({
    method: 'feed',  
    link: "http://...",
    name: "Some Title",
    caption: "Some Caption",
    description: "Some Description",
    picture: "http://..."
}, function(response) {
    if (response && response.post_id) {
        alert('Post was published.');
    } else {
        alert('Post was not published.');
    }
});

Also make sure that there are no errors in the console. But i did not see any error anyway.

Answer 6

Perhaps you should try using an anonymous function as a callback -

FB.ui(obj, function(response) {
  document.getElementById('msg').innerHTML = "Post ID: " + response['post_id'];
});