Fix up: Can't Load URL: The domain of this URL isn't included in the app's domains.

Issue

cannotloadurl_fb_share
Can't Load URL: The domain of this URL isn't included in the app's domains. To be able to load this URL, add all domains and subdomains of your app to the App Domains field in your app settings.

Scenario

  1. create a facebook app to get an appid
  2. use that appid in website to initialized the facebook javascript SDK
  3. use FB.ui to share content to facebook

full source codes

<!-- init facebook js sdk via your appid -->
<script>
  window.fbAsyncInit = function() {
    FB.init({
      appId            : 'yourappid',
      autoLogAppEvents : true,
      xfbml            : true,
      version          : 'v3.1'
    });
  };
  (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 = "https://connect.facebook.net/en_US/sdk.js";
     fjs.parentNode.insertBefore(js, fjs);
   }(document, 'script', 'facebook-jssdk'));
</script>
<script>
function share() {
    // use FB.ui() to share content to facebook
    FB.ui(
      {
        method: 'share',
        href: 'urlyouwanttoshare',
      },
      // callback
      function(response) {
        if (response && !response.error_message) {
          alert('Posting completed.');
        } else {
          alert('Error while posting.');
        }
      }
    );
}
</script>

<button onclick="share()">share</button>

Solution

1.Go to your app in facebook developers page(Settings->Basic)
2.Scroll down and Click on Add platform, choose Web sites
addplatform_website
3.Input your website domain
if you are testing via http://localhost:8080 then input http://localhost:8080
4.Save the changes
Then test again. you will find everything goes well.
sharewell

Notes

App Domains is not working for web site share to facebook.
That might be used for mobile apps.

Comments

Popular posts from this blog

react-native run-android : do not build/update modified code(App.js)

react-native run-android : sun.security.provider.cert path.SunCertPathBuilderException : unable to find valid certification path to req uested target

How to fix error : no module named sendgrid when try to use sendgrid python lib in PHP.