Making client side authorization to Facebook using Javascript JQuery - facebook

Here is what I want to:
I used OAuth 2.0 authorization system.
I already registered my application in Facebook, and I have got my application secret keys (i did server side code, but I need more user friendy authorization system).
Based on response from Facebook, how can I get response code from Facebook without reloading the page? In case you didn't understand what I mean take a look on next example:
Example is on this link:
http://www.badminton.si/1-turnir-b-kategorije-1-kolo-mbl
How can I then continue to get my access token so I can access my private information (like email)?
IN SHORT:
<script type="text/javascript" src="../Scripts/jquery-1.4.1-vsdoc.js"></script>
<script type="text/javascript" src="http://connect.facebook.net/en_US/all.js"></script>
<script type="text/javascript" src="http://static.ak.fbcdn.net/connect/en_US/core.debug.js"> </script>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml">
FB.init({
appId: my_api_key,
status: true,
cookie: true,
xfbml: true
});
FB.Event.subscribe('auth.login', function (response) {login();)}
FB.Event.subscribe('auth.logout', function (response) {logout();});
FB.getLoginStatus(function (response) {if (response.session) {login();}});
function login() {FB.api('/me', function (response) {alert(response.email)});
....
<fb:login-button v="2" size="large" autologoutlink="true" perms="email,user_birthday,status_update,publish_stream,read_stream">
</fb:login-button>

Just follow the examples on http://developers.facebook.com/docs/authentication/
On most of the functions you'll get callbacks that you can catch to get a token without having to reload the page.
From the documentation:
FB.init({appId: 'your app id', status: true, cookie: true, xfbml: true});
FB.Event.subscribe('auth.sessionChange', function(response) {
if (response.session) {
// A user has logged in, and a new cookie has been saved
} else {
// The user has logged out, and the cookie has been cleared
}
});
With the response.session object you should get everything you need without having to reload the page.

Related

facebook->getUser() return 0 if user grants basic permission but not extended permissions

i do login like this:
<script type="text/javascript">
function fbLogin(){
FB.init({ appId: 'FB_ID',
status: true,
cookie: true,
xfbml: true,
channelUrl: 'https://fbapps.promplac.si/channel.php',
oauth: true});
FB.login(function(response) {
if (response.authResponse) {
document.getElementById("korak1").submit();
} else {}
}, {scope:'email, user_likes, user_birthday, user_location, user_interests, photo_upload, publish_stream'});
}
</script>
And this is working normally
When user grants normal permissions, but not extended my form get submitted, but when i ask in php: facebook->getUser() it returns 0.
Is the same user uses my app again, and again he doesnt grant extended parmission, i normaly get userid by facebook->getUser().
What is wrong?
A the end i solved it from frontend end, i check if user is logged and then send access token to php.
some code example:
document.getElementById("accesstoken").value=FB.getAuthResponse()['accessToken'];

Calling the Facebook API

I has developed my apps and now I want to integrate them into Facebook. But I realize that it is dificult. I have this init method:
<javascript>
FB.init({
appId : '123456789',
status : true,
cookie : true,
xfbml : true,
channelUrl : 'http://xyz.dyndns.org:8080/fbchannel.html',
oauth : true
});
</javascript>
After that, I can call FB.login, and FB.ui to prompt to get permission, it's OK. But if I want to get some information with FB.api() (for example, get the user name, etc.), it doesn't work. How do I call the API?
The problem is: I can call fb.init. fb.login, fb.ui, and fb.getLoginStatus, but I can't call fb.api, not even the simplest method.
In my application setting, I used an application in Facebook, and then I typed my URL (a web application), htt://xyz.dyndns.org:8080/... . Is it OK?
(I am a newcomer in making applications in Facebook.)
What error are you getting? Here is a working FB.api call example:
<!DOCTYPE html>
<html>
<body>
<div id="fb-root"></div>
Get Info
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
FB.init({ appId: '**appId**', status: true, cookie: true, xfbml : true });
function getInfo() {
FB.login(function(response) {
if (response.session) {
FB.api('/me', function(response) {
alert('User: ' + response.name);
});
}
});
return false;
}
</script>
</body>
</html>

facebook comments callback function

I'm trying to fire an event when you log in to comment, but for some reason the event doesn't fire. Here's my code:
<script src="http://connect.facebook.net/en_US/all.js#appId=158693604164389&xfbml=1"></script>
<script type="text/javascript">
window.fbAsyncInit = function() {
FB.init({ appId: '158693604164389', status: true, cookie: true, xfbml: true });
FB.Event.subscribe('auth.login', function(response) {
document.getElementById('newsletter-placeholder').style.display = "block";
});
};
</script>
Any idea?
Thanks in advance.
Mauro
I suppose you mean, when the user logs-in when trying to use the comments plugin?
If this is what you mean, then no you can't capture this event!
auth.login -- fired when the user logs
in
This is fired when the user logs in (connects) to your application!

Can I require FBConnect with the new Graph API?

I'm using the new JS SDK API. (Graph API)
However, if I include the FeatureLoader.js for old FBCOnnect, then it will overwrite the graph API functions..
so, is there anyway in new JS SDK that I can do requireFeatures(['Connect'] ...) as in
FB.Bootstrap.requireFeatures(["Connect"], function()
{
}
No. None of that stuff is needed or supported in the new SDK. All you need to do is initialize the Javascript SDK and call the login method to login.
An example of how to do login:
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
FB.init({appId: 'your app id', status: true, cookie: true, xfbml: true});
FB.Event.subscribe('auth.sessionChange', function(response) {
if (response.session) {
// A user has logged in, and a new cookie has been saved
} else {
// The user has logged out, and the cookie has been cleared
}
});
$('#loginbutton').click(function() {
FB.login(function(response) {
if (response.session) {
// user successfully logged in
} else {
// user cancelled login
}
});
});
</script>

Facebook Graph API: FB.login() called before calling FB.init()

I'm trying to use the new Facebook Graph API on my website. This is what I have:
Somewhere on the page:
<fb:login-button autologoutlink="true" perms="email,user_birthday,status_update,publish_stream"></fb:login-button>
Right after the tag:
<div id="fb-root">
</div>
<script type="text/javascript">
window.fbAsyncInit = function () {
FB.init({ appId: '<%= ConfigurationManager.AppSettings["FBAppId"] %>', status: true, cookie: true, xfbml: true });
/* All the events registered */
FB.Event.subscribe('auth.login', function (response) {
// do something with response
alert("login success");
});
FB.Event.subscribe('auth.logout', function (response) {
// do something with response
alert("logout success");
});
FB.getLoginStatus(function (response) {
if (response.session) {
// logged in and connected user, someone you know
alert("login success");
}
});
};
(function () {
var e = document.createElement('script');
e.type = 'text/javascript';
e.src = document.location.protocol +
'//connect.facebook.net/en_US/all.js';
e.async = true;
document.getElementById('fb-root').appendChild(e);
} ());
</script>
but when I click on the generated login button, nothing happens.
In addition, I'm getting
FB.getLoginStatus() called before calling FB.init().
in Firebug console.
Any ideas?
I can't believe it, I was referencing a non existing key in the Web.config hence FB.init was failing silently.
It works as expected now.
To be clearer I wasn't passing the appId to FB.init, once I did, it worked.
Had the same issue, here is the solution that worked for me. Just put the following in your head section or in other words, add the app_id to the source of the facebook js.
<script src="//connect.facebook.net/en_US/all.js&appId=xxxxxxxxxxxxxxx" type="text/javascript"></script>
In my case, the problem went away after I disabled the XFBML functionality (i.e. setting the xfbml key to false, removing the fb: namespace and the #xfbml=1 fragment in <script src="…">). Good that I didn’t need it anyway.
YMMV, there are several other valid reasons why this error message can appear.