Given URL is not permitted by the application configuration

Question

I have used this in my html page...

<script>     
window.fbAsyncInit = function() {
    // init the FB JS SDK
    FB.init({
      appId      : 'xxxxxxxxxxxxxx', // App ID from the App Dashboard
      status     : true, // check the login status upon init?
      cookie     : true, // set sessions cookies to allow your server to access the session?
      xfbml      : true  // parse XFBML tags on this page?
    });

    // Additional initialization code such as adding Event Listeners goes here
};

// Load the SDK's source Asynchronously
// Note that the debug version is being actively developed and might 
// contain some type checks that are overly strict. 
// Please report such bugs using the bugs tool.
(function(d, debug){
     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" + (debug ? "/debug" : "") + ".js";
     ref.parentNode.insertBefore(js, ref);
}(document, /*debug*/ false));

 function shareOnFb(action, msg){
    FB.ui({ 
        method: action, 
        message: msg
    });
 }
</script>

when every I try to call any FB method it says this in my console

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 Apps domains.

this is my fb app setting.. do i need to change something here, m running my website locally for time being, so i tried adding

localhost/OfferDrive/ to app domain on this page but it says error that it is not a valid domain

Answer 1

You need to fill the value for Website with Facebook Login with the value http://localhost/OfferDrive/ to allow Facebook to authenticate that the requests from JavaScript SDK are coming from right place

Answer 2

Update to Anvesh Saxena's answer(correct but outdated as FB App interface has changed):

In your FB App configuration you need to add a Website platform with your website's URL set. Then you can add App Domains which I set to our website's base domain (e.g. for a URL like http://www.mycoolwebsite.com, just use mycoolwebsite.com).

IMPORTANT: In order for this to work you'll need to be using a subdomain of your app's URL for your local development. You can do this easily by modifying your hosts file on your development computer to use a non-existent subdomain of your website such as local.mycoolwebsite.com. Just google 'edit hosts file' for your platform (e.g. mac / windows) if you're not familiar with how to do this.

Answer 3

Settings -> Advanced, add url to "Valid OAuth redirect URIs". This works for me.

Answer 4

• Go to Facebook for developers dashboard
• Click My Apps and select your App from the dropdown.
  (If you haven't already created any app select "Add a New App" to create a new app).
• Go to App Setting > Basic Tab and then click "Add Platform" at bottom section.
• Select "Website" and the add the website to log in as the Site URL(e.g. mywebsite.com)
• If you are testing in local, you can even just give the localhost URL of your app.
  eg. http://localhost:8080/myfbsampleapp
• Save changes and you can now access Facebook information from http://localhost:8080/myfbsampleapp

Answer 5

An update to munsellj's update..

I got this working in development just by adding localhost:3000 to the 'Website URL' option and leaving the App Domains box blank. As munsellj mentioned, make sure you've added a website platform.

Answer 6

1. From the menu item of your app name which is located on the top left corner, create a test app.
2. In the settings section of the new test app: add 'http://localhost:3000' to the Website url and add 'localhost' to App domains.
3. Update your app with the new Facebook APP Id
4. Use Facebook sdk v2.2 or whatever the latest in your app.

Answer 7

Note, the localhost is a special string that FB allows here. If you didn't configure your debugging environment under localhost, you'll have to push it underneath that name as far as I can tell.

Answer 8

Sometimes this error occurs for old javascript sdk. If you save locally javascript file. Update it. I prefer to load it form the facebook server all the time.

Answer 9

Missing from the other answers is how to allow localhost(or 0.0.0.0 or whatever) as an oauth callback url. Here is the explanation. How can I add localhost:3000 to Facebook App for development

Answer 10

Another reason this can happen is if you send the wrong appId. This can happen in early development if you have a development app and a production app. If you hard-code the appId for dev and push to prod, this will show up.