Search code examples
facebook-sharerfb.ui

Facebook SDK FB.ui Link Sharer: "An error occurred. Please try again later."


I have modified xdamman's excellent selection-sharer JQuery library (https://github.com/xdamman/selection-sharer) to use FB.ui instead of facebook's /dialog/feed widget. This is because neither the /dialog/feed widget nor the /sharer/sharer.php widget are able to control the link summary for the shared link. So I have used the following code:

  FB.ui(
    {
      method: 'feed',
      name: name, // (e.g. "Interesting News Item")
      link: self.url2share, // (the current URL as determined by window.location.href, e.g. "https://www.commonspace.scot/articles/2688/poll-snp-support-surges-further-with-months-to-go-before-scottish-elections")
      picture: picture, // (e.g. "https://www.commonspace.scot/public/artarticle/a3/41/4162_6493.jpg?c=64a2);%20?%3E")
      caption: 'commonspace.scot',
      description: text // (arbitrary text string)
    },
    function(response) {
      if (response && response.post_id) {
        //alert('Post was published.');
      } else {
        //alert('Post was not published.');
      }
    }
  );

FB.ui is initialised like so:

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

Now here's the real kicker -- the above code works JUST FINE when run from the dev server at https://dev.commonspace.scot yet the error "An error occurred. Please try again later." is encountered whenever sharing on the main server.

Things I have tried:

  • Replacing the above code with the following demo code from facebook's website:

      FB.ui(
        {
          method: 'share',
          href: 'https://developers.facebook.com/docs/',
        },
        // callback
        function(response) {
          if (response && !response.error_message) {
            alert('Posting completed.');
          } else {
            alert('Error while posting.');
          }
        }
      );
    

    Error encountered: "This app is in demo mode and you don't have permission to view it."

  • Replacing all dynamically-generated strings (name, link2share, picture, description) with predefined dummy text. Error encountered: "Given URL is not permitted by the application configuration.: One or more of the given URLs is not allowed by the App's settings. It must match the Website URL or Canvas URL, or the domain must be a subdomain of one of the App's domains."

  • Adding

    redirect_uri: 'https://www.commonspace.scot',

as a parameter for FB.ui. Result: "An error occurred. Please try again later."

The following important settings have been specified for the app:

  • App is in published mode (they have removed "sandbox" afaict)
  • The app ID is set using a meta tag:

     <meta property="fb:app_id" content="1011782388842782" />
    

... and the sharer library is aware of the app ID.

  • Display name and contact email have both been set for the app.
  • Three app domains have been specified: commonspace.scot, dev.commonspace.scot, www.commonspace.scot; though I have also tried with just one domain (commonspace.scot).
  • The site URL is set to "https://www.commonspace.scot/".

Important note: these errors are fairly generic and are displayed across much of the Facebook SDK. Most of the answers I have seen so far, including on stackoverflow, pertain to other parts of the SDK, e.g. the OAuth is particularly common with these specific errors. I am unclear how, if at all, the answers which apply there apply here. I have tried a variety of such solutions, but its unclear, to pick one particular, what "Callback URI/URL" would mean in this context or if it would help. This question pertains to the sharer dialog box only.

Thank you in advance.


Solution

  • I would be very interested to know if anyone has an explanation for why FB.ui works on the dev site but not the production site. Such an answer would be very useful for other people as well.

    In the meantime, if anyone else is suffering from the exact same problem, I eventually went back to use /dialog/feed widget instead of FB.ui with the following changes:

      var url = 'https://www.facebook.com/dialog/feed?' +
                'app_id='+self.appId +
                '&display=popup'+
                '&picture='+encodeURIComponent(picture)+
                '&caption='+document.domain+
                '&name='+encodeURIComponent(name)+
                '&description='+encodeURIComponent(text)+
                '&link='+encodeURIComponent(self.url2share)+
                '&href='+encodeURIComponent(self.url2share)+
                '&redirect_uri='+encodeURIComponent(self.url2share);
    

    You can view the complete source, or use the library yourself, using my fork https://github.com/djcf/selection-sharer