I am trying to implement Facebook Connect on a website. I am trying to work with Javascript SDK of Facebok. I am new to it and unfortunately most of links provided in Facebook WIKI are out of date... Returning 404 not found. Anyway I added this code before the ending </body>
:
<script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script>
<div id="fb-root"></div>
<script src="http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php" type="text/javascript"> </script>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
FB.init({
appId : '12344', // my real app id is here
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : false // parse XFBML
});
FB.login(function(response) {
if (response.session) {
if (response.perms) {
alert('user is logged in and granted some permissions');
// user is logged in and granted some permissions.
// perms is a comma separated list of granted permissions
} else {
alert('user is logged in, but did not grant any permissions');
// user is logged in, but did not grant any permissions
}
} else {
alert('user is not logged in');
// user is not logged in
}
}, {perms:'email'});
</script>
And I have a login button at some other place (much before the above scripts) in the same page rendered with:
<fb:login-button v="2">Connect with Facebook</fb:login-button>
This button renders as a normal fb connect button and clicking it opens a new popup window as it normally should. Problem is that it shows 'invalid api key specified' error. On inspecting address bar of popup, I see that api_key=undefined is passed to it :(
Any idea about this? I am trying to fix this for last 5 hours now... Please help me found out why correct API key is not being passed to popup window.
Thanks in advance.
The Facebook SDK for JavaScript provides a rich set of client-side functionality that: Enables you to use the Like Button and other Social Plugins on your site. Enables you to use Facebook Login to lower the barrier for people to sign up on your site. Makes it easy to call into Facebook's Graph API.
JavScript Code: FB. getLoginStatus() – Check whether the user already logged in. fbLogin() – Open a login dialog to login with Facebook account credentials. getFbUserData() – Fetch the user's account data from Facebook and display profile info and login status to the user.
I'm doing the same thing, and i found an example that is very simple to implement and understand (here thay use jQuery, but you can do the same without libraries):
<body>
<div>
<button id="login">Login</button>
<button id="disconnect">Disconnect</button>
</div>
<div id="user-info" style="display: none;"></div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
// initialize the library with the API key
FB.init({ appId : '12344' });
// fetch the status on load
FB.getLoginStatus(handleSessionResponse);
$('#login').bind('click', function() {
FB.login(handleSessionResponse);
});
$('#disconnect').bind('click', function() {
FB.api({ method: 'Auth.revokeAuthorization' }, function(response) {
clearDisplay();
});
});
// no user, clear display
function clearDisplay() {
$('#user-info').hide('fast');
}
// handle a session response from any of the auth related calls
function handleSessionResponse(response) {
// if we dont have a session, just hide the user info
if (!response.session) {
clearDisplay();
return;
}
// if we have a session, query for the user's profile picture and name
FB.api(
{
method: 'fql.query',
query: 'SELECT name, pic FROM profile WHERE id=' + FB.getSession().uid
},
function(response) {
var user = response[0];
$('#user-info').html('<img src="' + user.pic + '">' + user.name).show('fast');
}
);
}
</script>
</body>
Look here for the entire code, and here you can find other resource.
I had set my facebook connect address to have www and I was accessing my test site with non www, when I switched to the www version fb connect worked fine.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With