Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Facebook javascript connect with localhost domain

I am trying to create facebook connect using javascript which gives follwing error:

Given URL is not allowed 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.

Does is due to I am using Localhost server for testing? Do I need to purchase domain to test this or what? Or do I need to make changes in following code:

my code:

<?php
//
// uses the PHP SDK. Download from https://github.com/facebook/php-sdk
include("facebook-php-sdk/src/facebook.php");

//
// from the facebook app page
define('YOUR_APP_ID', '321849981247524');
define('YOUR_APP_SECRET', '49fd00ce6237aff0af08fd8ca25dbc92');

//
// new facebook object to interact with facebook
$facebook = new Facebook(array(
 'appId' => YOUR_APP_ID,
 'secret' => YOUR_APP_SECRET,
));
//
// if user is logged in on facebook and already gave permissions
// to your app, get his data:
$userId = $facebook->getUser();

?>
<html>
<head>
 <style>body { text-align:center; font-size: 40px }</style>
</head>
<body>
<?php
if ($userId) {
 //
 // already logged? show some data
 $userInfo = $facebook->api('/' + $userId);

echo "<p>YOU ARE: <strong>". $userInfo['name'] ."</strong><br/>";
echo "Your birth date is: ".$userInfo['birthday']."</p>";



} else {
 //
 // use javaascript api to open dialogue and perform
 // the facebook connect process by inserting the fb:login-button
 ?>
 <div id="fb-root"></div>
 <fb:login-button scope='email,user_birthday'></fb:login-button>
 <?php
}
?>
 <script>
 window.fbAsyncInit = function() {
 FB.init({
 appId : <?=YOUR_APP_ID?>, //When I gives app ID "321849981247524" or my own created it gives error that it's not valid
 status : true,
 cookie : true,
 xfbml : true,
 oauth : true,
 });

FB.Event.subscribe('auth.login', function(response) {
 // ------------------------------------------------------
 // This is the callback if everything is ok
 window.location.reload();
 });
 };

(function(d){
 var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
 js = d.createElement('script'); js.id = id; js.async = true;
 js.src = "//connect.facebook.net/en_US/all.js";
 d.getElementsByTagName('head')[0].appendChild(js);
 }(document));
</script>
</body>
</html>

When I run in browser it shows facebook button and on click redirect to new windows to do FB loging but then shows above mentioned error!

like image 737
user123 Avatar asked Nov 30 '22 03:11

user123


2 Answers

I know that this is an old question but here is a tested and working solution for anyone who ends up here looking for an answer:

At start App Domains field should be left blank.

Click 'Add Platform' button below and choose 'Website'.

In the new Website form you can add localhost in the Site URL field:

eg. http://localhost:3000/

For a visual guide with images you can check this answer.

Apart from this, you can actually use user123's answer, and map localhost to a local domain (eg. 'myproject.dev') and the local dev domain must be entered in the same Site URL field: eg. http://myproject.dev/

like image 143
orszaczky Avatar answered Dec 06 '22 06:12

orszaczky


You should use some alias domain when you want to connect your Facebook application with your local environment.

Try the following:

       Go to your etc/hosts file and add the following line:

       127.0.0.1 dev01.dev # you can change domain to whatever you want

       Go to Facebook App Dashboard and register your application using dev01.dev as domain!

       Add your Site URL (eg. http://dev01.dev/project/ )

It should works.

Edit: You can also check this question: Facebook development in localhost

Source: facebook localhost developer

like image 20
user123 Avatar answered Dec 06 '22 08:12

user123