I'm new to facebook API and I have some questions related to facebook authentication.
I have created an application and have edited the domain and url.
Website Domain
giftme.web44.net
Site URL
http://www.giftme.web44.net/
I used the following on my site webpage:
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '3347207XXXXXXXX', // App ID (I've replaced for security reasons)
channelUrl : 'http://giftme.web44.net/channel.html/', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
// Additional initialization code here
};
// Load the SDK Asynchronously
(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));
</script>
And I've created the page 'channel.html' with only this:
<script src="//connect.facebook.net/en_US/all.js"></script>
Finally I used the login button:
<div class="fb-login-button" >Login with Facebook</div>
What i'm I doing wrong?
I keep getting this error:
API Error Code: 191
API Error Description: The specified URL is not owned by the application
Error Message: Invalid redirect_uri: A URL informada não é permitida pela configuração do aplicativo.
http://www.giftme.web44.net/ is not equal to http://giftme.web44.net/
The redirect_url must contain the Site URL or Canvas URL as defined in your App Properties.
An example would be:
https://api.facebook.com/method/admin.setAppProperties?
access_token=CURRENTTOKEN&
properties={'post_authorize_redirect_url':'http://giftme.web44.net/channel.html/'}
Error code 191
FB App Properties
Related
I am trying to use javascript sdk for rendering a XFBML form on our site and i keep getting
Unable to load the registration form for . You may have previously blocked this app on Facebook. Go to your Facebook privacy settings to unblock this app. (Error: Invalid 'client_id'.)
my app is registered and with correct id.
the code looks like is:
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '118446328234891', // App ID
channelUrl : '//www.sakshum.org/channel.html', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
// Additional initialization code here
};
// Load the SDK Asynchronously
(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));
</script>
<script src="https://connect.facebook.net/en_US/all.js#appId=118446328234891&xfbml=1"></script>
<fb:registration fields="name,birthday,gender,location,email" redirect-uri="http%3A%2F%2Fwww.sakshum.org%2FFbValidation" width="530">
</fb:registration>
just to add on if i use non xfbml version using just iframe then all works fine.
Looks like the issue was using encoded redirect_uri. changing it to normal url fixed the issue.
The redirect-uri must match with the setting "Site URL" in your Facebook app.
My problem is to display a login button and(once the user is logged in) show his profile image, name and a "logout" link.
In the facebook api documentation (here http://developers.facebook.com/docs/guides/web/#login) i found this example:
<html>
<head>
<title>My Facebook Login Page</title>
</head>
<body>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'YOUR_APP_ID', // App ID
channelUrl : '//WWW.YOUR_DOMAIN.COM/channel.html', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
FB.api('/me', function(user) {
if (user) {
var image = document.getElementById('image');
image.src = 'http://graph.facebook.com/' + user.id + '/picture';
var name = document.getElementById('name');
name.innerHTML = user.name
}
});
};
// Load the SDK Asynchronously
(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));
</script>
<div align="center">
<img id="image"/>
<div id="name"></div>
</div>
</body>
</html>
That should do what i was looking for. I replaced 'MY_APP_ID' and MY_DOMAIN.COM with my app_id and my domain site (http://localhost/index.html). I also added a login button as i found on the documentation (that works and allow me to log in) but then no image nor name is shown. I wrote the "user" object in a console and it conatins this:
error: Object
code: 2500
message: "An active access token must be used to query information about the current user."
type: "OAuthException"
How should I use this "active access token"?
In order to accomplish any user data retrieval, every Facebook application must first authenticate the user session to ensure that the app has the permission of the end user to retrieve their data.
Reference: https://developers.facebook.com/docs/authentication
Retrieve their access token with the Javascript SDK and you should be able to begin retrieving their user display name and image as a result.
Facebook JS SDK: https://github.com/facebook/facebook-js-sdk/
im using this code to create a facebook connect button on my site:
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
apiKey: 'xxxxxxxxxxxxxxxxxxxMQTQ2DshKBkNG4aAZDZD',
appId : 'xxxxxxxxxxxxxxxx', // App ID
channelUrl : '//www.xxx.net/channel.html', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
// Additional initialization code here
};
// Load the SDK Asynchronously
(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));
function logOut(){
FB.logout();
}
</script>
<div class="fb-login-button" data-show-faces="false" data-width="200" data-max-rows="1"></div>
<a href="#" onclick="logOut();" >Logout</a>
when i hit the login button , im loggin in but when i hit the logout link
i get disconnected from facebook (not from the app itself)
and then when i do the following:
1. log in again (directly on facebook.com )
2. go to my site
3. hit the login , and it sais im alread connected to the app
what am i doing wring here ?
If I understand this correctly, you are expecting to get disconnected from the app as well? That is not how it works. When you authorize an app, it will stay authorized unless you remove it from the authorized list in FB. Logging out will only log you out of FB.
When you login to FB, as your app is authorized already, hitting the login button goes to FB sees that its already authorized, tells you so.
am trying to use facebook login on my site and here is how i load the sdk
window.fbAsyncInit = function() {
FB.init({
appId : '362869753746986', // App ID
channelUrl : '//WWW.FESTIVEHUB.COM/channel.html', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
// Additional initialization code here
};
// Load the SDK Asynchronously
(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));
and the login button
<div class="fb-login-button" data-show-faces="true" data-width="200" data-max-rows="2"></div>
if i click the login button it shows a new facebook window for login and if i do it logs in the problem however are after the login the small new window remains and it blank but if i manually close it and refresh my page the login button is replaced with my FB profile picture so i need that login window to close automatically and i need a callback function so i can take action after the login. NB am working on localhost if its worth noting!
Your code looks OK, but your issue is probably your channelUrl file. The domain on the channel URL, your applications registered URL, and the URL you are trying to login from all have to match. The channel file also needs to have a single line
<script src="https://connect.facebook.net/en_US/all.js"></script>
to work.
I am trying to add a facebook comments box using the social plugin to an application which will be running inside facebook as a facebook app.
When I view the app via its url it works fine however when I view the app in the dev facebook app the comments plugin does not load. Does anyone know if this is possible or if there are any additional settings required.
I have tried setting the data-href to the url of where the app is served from and the url of the facebook app neither seem to work
<div class="fb-comments" data-href="[MYDOMAIN]” data-num-posts="30" data-width="470"></div>
The code is just the standard snippet from fb js sdk
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '[MYAPPID], // App ID
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
FB.Canvas.setAutoGrow();
// Additional initialization code here
};
// Load the SDK Asynchronously
(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));
Try providing a channel file and channelUrl.
From the Facebook JavaScript SDK documentation:
"...pages that include code to communicate across frames may cause Social Plugins to show up as blank without a channelUrl..."
FB.init({
appId : 'YOUR_APP_ID', // App ID
channelUrl : '//WWW.YOUR_DOMAIN.COM/channel.html', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});