I am trying to add Facebook connect on my website but I am experiencing lot of issues since Facebook moved to OAuth 2 protocol.
I would like users log in with their Facebook account and then, I would store their data in my database.
So I am using the Javascript SDK to catch the auth.login event and then redirect to my fb_login method which use Facebook PHP SDK.
But here is my first issue, most of the time, the auth.login event is not catch by the listener and so my method is not called.
Here is my “listener” Javascript code:
<div id="fb-root"></div>
<script type="text/javascript">
window.fbAsyncInit = function() {
FB.init({
appId: '<?php echo $this->config->item('facebook_app_id'); ?>',
status: true,
cookie: true,
xfbml: true,
oauth: true
});
FB.Event.subscribe('auth.login', function(response) {
[removed] = "<?php echo site_url('donateur/fb_signin'); ?>";
});
FB.Event.subscribe('auth.logout', function(response) {
alert("Logout :(");
});
FB.Event.subscribe('auth.authResponseChange', function(response) {
alert('The status of the session is: ' + response.status);
});
};
(function() {
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol +'//connect.facebook.net/en_US/all.js';
document.getElementById('fb-root').appendChild(e);
}());
I would like to know if anyone has already experience this issue?
Does anybody has a “recent” doc about how to use Facebook connect in CodeIgniter?
http://codeigniter.com/forums/viewthread/189744/
And this: http://www.dannyherran.com/2011/02/facebook-php-sdk-and-codeigniter-for-basic-user-authentication/
Related
Here is the complete snippet of code that I am using. I have read through all the documentation and still not able to figure out this. I am running the code locally on visual studio 2010 and chrome browser. I have set my site url, canvas url and secure canvas url as localhost. I have my app domain empty. I am guessing that I am doing something wrong and I cannot figure out. Please help me
<html>
<body>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '129307260602861',
status : true,
cookie : true,
xfbml : true,
oauth : true,
});
FB.Event.subscribe('auth.login', function(response) {
fblogin(); //first login time
});
FB.Event.subscribe('auth.authResponseChange', function(response) {
alert('The status of the session is: ' + response.status);});
FB.Event.subscribe('auth.logout', function(response) {
alert('logout');
});
};
(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);
} ());
function fblogin() {
FB.getLoginStatus(function(response) {
if (response.status === 'connected') {
//check extened permisions
var access_token = response.authResponse.accessToken;
var user_id = response.authResponse.userID;
// Do your business
alert('here');
}
else {
//user is not logged in
alert('here');
}
});
}
</script>
<fb:login-button autologoutlink='true' perms='email,user_birthday,status_update,publish_stream'></fb:login-button>
</body>
</html>
I am currently working in one facebook application which is going to run outside the facebook in one webpage having functionality of like page, but on bases of like i have to redirect page on different pages,
I tried lots of code to check whether user liked page already or not but failed.
So If any one knows how to check this than please help me.
Thanks in advance.
Note : Want to do only using JS SDK not PHP SDK.
To access the like data form facebook you need user_likes permission.
<div id="fb-root">
</div>
var page_id = 'YOUR PAGE / URL ID';
(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);
} ());
window.fbAsyncInit = function() {
FB.init({ appId: 'YOUR APP ID', status: true, cookie: true, xfbml: true, oauth: true });
FB.login(function(response) {
if (response.authResponse) {
FB.api('/me/likes/' + page_id, function(api_response) {
try {
if ((api_response.data[0].name) != undefined)
alert(api_response.data[0].name);
else
alert('you are not like this page');
}
catch (e) {
alert('you are not like this page');
}
});
}
}, { scope: 'email,user_likes' });
};
You have to get user_likes permission, and then make a call to the Graph API requesting /me/likes/{facebook_id_of_your_URL}
That call returns a data array with your URL-objects data, or an empty data array if the user hasn’t liked it yet.
I have been seeing questions on Stack Overflow to access the Facebook friends list of a user. I have tried in many different ways to do this and unfortunately nothing seems to be working for me.
Can any one tell me the exact problem I am facing? I'm totally new to javascript. Below is the code I am using
<html>
<head>
<title>My Facebook Login Page</title>
</head>
<body>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
var friends = new Array();
FB.init({
appId : 'some_id', // App ID
channelUrl : 'http://apps.facebook.com/myapp', // 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/friends', function(response) {
if(response.data) {
$.each(response.data,function(index,friend) {
alert(friend.name + ' has id:' + friend.id);
});
} else {
alert("Error!");
}
});
};
// Load the SDK Asynchronously
(function(d){
var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "http://connect.facebook.net/en_US/all.js";
d.getElementsByTagName('head')[0].appendChild(js);
}(document));
</script>
<p>
<fb:profile-pic uid='loggedinuser' facebook-logo='true'/>
</p>
</br>
</br>
"Welcome, <fb:name uid='' useyou='false'></fb:name>
</br>
</br>
</br>
</br>
</br>
</br></br> <fb:login-button autologoutlink="true" />
</body>
</html>
I am getting the response as undefined and am not able to even login to facebook. I tried using the following sample http://jobyj.in/api/get-facebook-friends-using-javascript-sdk/. This works fine with the Demo but then I downloaded it and tried to run from my machine it is also not giving me any result.
Any suggestions for me?
Update
I am using the example given by #Somnath below and able to login. But after that getting the value undefined for response.session resulting in zero friends list. Any idea for this?
Here is tutorial for login through javascript.
Tutorial Javascript SDK
Ist try to log in. Otherwise you will get undefined response.
FB.getLoginStatus(function(response) {
if (response.session) {
// logged in and connected user, someone you know
FB.api('/me/friends', function(response) {
if(response.data) {
$.each(response.data,function(index,friend) {
alert(friend.name + ' has id:' + friend.id);
});
} else {
alert("Error!");
}
});
}
});
You will get friend list of logged in user.
Updated Answer:
Don't specify channelUrl at time of initialization. Only give only following four parameters. Try this out.
FB.init({
appId : 'some_id', // App ID
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
Update2:
Try using fql:
if (response.session) {
//getting current logged in user's id from session object
globaluserid=response.session["uid"];
//fetching friends uids from 'friend' table. We are using FB.api syntax
FB.api(
{
method: 'fql.query',
query: 'SELECT uid1 FROM friend WHERE uid2='+globaluserid
},
function(response) {
//once we get the response of above select query we are going to parse them
for(i=0;i<response.length;i++)
{
//fetching name and square profile photo of each friends
FB.api(
{
method: 'fql.query',
query: 'SELECT name,pic_square FROM user WHERE uid='+response[i].uid1
},
function(response) {
//creating img tag with src from response and title as friend's name
htmlcontent='<img src='+response[0].pic_square+' title='+response[0].name+' />';
//appending to div based on id. for this line we included jquery
$("#friendslist").append(htmlcontent);
}
);
}
}
);
} else {
// no user session available, someone you dont know
top.location.href="../kfb_login.php";
}
I am trying to write a code that checks whether the user is logged in or not,
and found that there is a built-in method in FBJS API, which is called getLoginStatus()
I have implemented it inside of html,
but for some how, alert() inside of the getLoginStatus() is not fired.
I have also tried to add channelUrl at init(),but it still does the same.
Below is the code that I have written.
Can anyone help me with it?
Thanks in advance!
<!-- Initialize FB API for use -->
<div id="fb-root"></div>
<script type="text/javascript">
//var curLoc = window.location;
//var chanURL = curLoc.protocol + "//" + curLoc.hostname + ":" +
//curLoc.port + "/channel.html"
window.fbAsyncInit = function() {
FB.init({appId: '####', status: true, cookie: true, xfbml: true});
FB.getLoginStatus(function(response) {
if (response.session) {
// logged in and connected user, someone you know
alert('logged in');
} else {
// no user session available, someone you dont know
alert('not logged in');
}
});
};
(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>
I had this the other day and the problem was that I was NOT logged in in Facebook AND my App was in Sandbox mode. Maaaaybe it's the same here, longshot but wanted to suggest it anyway.
Note: Comparable combinations that wouldn't work are being logged in in Facebook as a Test user that has no access to the application in question or being logged in in Facebook as a non-test/non-admin user AND having the app in sandbox mode.
BTW. They changed it again.
It is now:
response.authResponse
and not response.session anymore.
I was having the same problem. I was caused by the 'Sandbox Mode' in the FB App settings. When enabled, it won't fire the getLoginStatus() response. Probably because it is unknown if you're actually a registered developer when not logged in.
They changed it. Run console.log on response, and see you need to test as so:
if (response.status=='connected')) {...}
edit: here is most of my login:
<?php
// using Facebook PHP SDK (v.3.1.1)
$facebook = new Facebook(array(
'appId' => APP_ID
'secret' => SECRET
));
// See if there is a user from a cookie
$user = $facebook->getUser();
if ($user) {
try {
// Proceed knowing you have a logged in user who's authenticated.
$user_profile = $facebook->api('/me');
} catch (FacebookApiException $e) {
echo '<pre>'.htmlspecialchars(print_r($e, true)).'</pre>';
$user = null;
}
}
?>
and the js in the body:
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '<?php echo $facebook->getAppId(); ?>',
status : true,
cookie : true,
oauth: true,
channelUrl : MY_CHANNEL_URL,
xfbml : true
});
FB.getLoginStatus(function(response) {
console.log( response );
if ((response.status)&&(response.status=='connected')) {
loadStreamInto ( $("#FBmessages") );
} else {
}
});
};
</script>
I assume you replaced you actual appId with #### in the code you linked. If not, that is your problem.
Assuming you have actually placed your appId in here, it could be related to the fact that you are testing on localhost. I believe that the javascript will not function if the url it is being served from does not match up with the url associated with the app for the given App Id
the response.status=='connected' happens only if you put oauth:true in fb.init
code looks fine to me should work as is not sure why it doesn't work
I'm not saying this would work for you, but I had a similar problem with my deployed app. It worked fine on my localhost but not when deployed to Heroku. I realised that in the Facebook App settings I had the urls all set as local ones - when I changed this to my deployed app url it fixed it.
I've been trying to use Facebooker2 as a means to login via Facebook in Rails. However, Facebooker2's current_facebook_user function is somehow returning nil even though I'm definitely logged in on Facebook. Any ideas? Thanks!
Here's the gist of my code:
In one of my controllers:
def check_login
if current_facebook_user.nil?
"This always gets returned, even though I'm logged into Facebook."
else
"This never gets run"
end
end
Facebook JS. The line in FB.Event.subscribe('auth.login', function(response) { ... } redirects to the check_login function above.
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '123456789012345',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
channelUrl : 'true', // add channelURL to avoid IE redirect problems
xfbml : true // parse XFBML
});
FB.Event.subscribe('auth.login', function(response) {
window.location = "http://www.mysite.com/check_login";
});
}; ( function() {
var s = document.createElement('div');
s.setAttribute('id', 'fb-root');
document.documentElement.getElementsByTagName("body")[0].appendChild(s);
var e = document.createElement('script');
e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
e.async = true;
s.appendChild(e);
}());
function logout() {
FB.logout();
window.location = 'http://www.mysite.com/logout';
};
</script>
If you login through your browser using the Facebook JavaScript SDK the users session data is held within the browser. As result your Rails code is unaware of the change in the users state. So you have to explicitly pass valid current user session data back to your server from which you can maintain a valid session server side as well.
For example:
FB.Event.subscribe('auth.login', function(response) {
window.location = "http://www.mysite.com/check_login?session=" + JSON.stringify(response.session);
});