We just switched to new PHP SDK and JS today. but the problem is weird. When we dont use show-faces with perms attribute it doesnt show popup. Only way to get permission popup appear, we need to use show-faces attr.
is this a bug ?
<fb:login-button perms="email, publish_stream, offline_access, create_event, user_photos, user_online_presence, user_videos, user_website, user_events, user_relationships, user_interests" size="large">Sign Up With Facebook</fb:login-button>
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId: '<?php echo $facebook->getAppID() ?>',
cookie: true,
xfbml: true,
oauth: true
});
FB.Event.subscribe('auth.login', function(response) {
window.location.reload();
});
FB.Event.subscribe('auth.logout', function(response) {
window.location.reload();
});
};
(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);
}());
</script>
Thanks
EDIT:
OMG. i just found the solution, with the new JS SDK we must use scope instead of perms attribute!
with the new JS SDK we must use scope instead of perms attribute!
Alternatively you can use straight Javascript and make your own buttons.
<script>
function addPermissions(permissions){
FB.login(function(response) {
if (response.session) {
if (response.perms) {
// user is logged in and granted some permissions.
} else {
// user is logged in, but did not grant any permissions
}
} else {
// user is not logged in
}
}, {perms:permissions});
}
</script>
<a onclick="addPermissions("email, publish_stream,...");">Click me</a>
Related
I googled for nearly 4 hours and am posting this.
I am trying to implement facebook login in my website.
The problem is login is working fine, after login it has to redirect to anther custom page,
its not redirecting but staying in the same page. Here is my code that am using.
<head>
<title>My Facebook Login Page</title>
<script src="//connect.facebook.net/en_US/all.js"></script>
</head>
<body>
<div id="fb-root"></div>
<fb:login-button perms="email"></fb:login-button>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'XXXXXXXXXX',
status : true,
cookie : true,
xfbml : true
});
FB.Event.subscribe('auth.login', function() {
window.location = "about_us.html";
});
};
(function() {
var e = document.createElement('script');
e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
e.async = true;
document.getElementById('fb-root').appendChild(e);
}());
</script>
<!-- <div class="fb-login-button" >Login with Facebook</div> -->
Kindly guide me where am wrong also if possible correct code
I had taken the code from below link.
Redirect after clicking on the Facebook login button, even if already logged in Facebook
Thanks in advance.
you can just add this somewhere
FB.login(function(response) {
if (response.authResponse) {
window.top.location = "http://www.foo.com";
}
});
When I put
window.top.location = "http://www.foo.com";
under
FB.getLoginStatus(function(response) {
statusChangeCallback(response);
window.top.location = "";
});
it worked.
I am new to Facebook app development. Following is my html and script code to retreive access token for facebook users.
I am having a checkbox and on Selecting the checkbox, I need the facebook login authentication form to be loaded.
<html xmlns:fb="https://www.facebook.com/2008/fbml">
<body>
<table>
<tr>
<td>
<input type="checkbox" value="Facebook" name="facebook" id="facebook" onclick="checkFacebookLoginCredentials(this,'fb')"/>
<div id="fb-root"></div>
</td>
</tr>
</table>
</body>
<script type="text/javascript">
var userFBAccessToken="";
function checkFacebookLoginCredentials(field, accountType)
{
loadFBAuthenticationWindow(); //Function to load the facebook login authentication window
}
function loadFBAuthenticationWindow()
{
window.fbAsyncInit = function()
{
FB.init({
appId : 'MY_APP_ID', // App ID
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true, // parse XFBML
oauth : true
});
FB.login(function(response)
{
if (response.authResponse)
{
console.log('Welcome! Fetching your Facebook information....');
userFBAccessToken = response.authResponse.accessToken;
console.log('userFBAccessToken: ' + userFBAccessToken);
FB.api('/me', function(response)
{
console.log('Good to see you, ' + response.name + '.');
FB.logout(function(response) {
console.log('Logged out.');
});
});
} else {
console.log('User cancelled login or did not fully authorize.');
}
}, {scope: 'user_activities,user_notes,user_photos,user_videos,user_status,offline_access'});
};
// Load the SDK Asynchronously
(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);
}());
}
</script>
</html>
When I try to load the above html, I can see the iFrame (Facebook login authentication form) loaded properly in Chrome and FireFox browsers.
But when I tried to execute in SAFARI, the iFrame is not loaded.
Can anyone please say, what I have missed in the above code? Any suggestion please..
This sounds like a bug, especially if this is working in one browser but not the other. Please file this in the bugtracker: http://developers.facebook.com/bugs
The user is logged in to my site using the latest PHP SDK.
If the user clicks the facebook logout URL that appears in my site, he logs out from facebook and is redirected back to my site where I can do some cleanups.
However, if while in session (in my site and in facebook) the user goes to www.facebook.com and logs out from there, my site is clueless about it. I need to be notified about this in my site so I can do cleanups.
The only solution I can think of is to call from every page in my site to getLoginStatusUrl(), but this seems to be an overkill. Isn't there a way to ask facebook to call some URL in my site when the user logs out from facebook itself?
You can use js to subscribe to the auth.logout event as per the facebook example:
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId: '<?php echo $facebook->getAppID() ?>',
cookie: true,
xfbml: true,
oauth: true
});
FB.Event.subscribe('auth.login', function(response) {
window.location.reload();
});
FB.Event.subscribe('auth.logout', function(response) {
window.location.reload();
});
};
(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);
}());
</script>
The FB.getLoginStatus function doesn't work for me for some reason - although it used to for some time.
Very basic code below, and the alert never popups - looks like FB.getLoginStatus never calls the supplied function.
Any ideas ?
<body>
<form id="form1" runat="server">
<div id="fb-root">
</div>
<script type="text/javascript" src="http://connect.facebook.net/en_US/all.js"></script>
<script type="text/javascript">
FB.init({ appId: 'xxx', status: true, cookie: true, xfbml: true });
FB.getLoginStatus(function (response) {
alert("Hi there");
});
</script>
</form>
If your app is in Sandbox Mode see this bug: https://developers.facebook.com/bugs/240058389381072
Also read the comments by Philip Bulley
[...] Essentially sandboxed applications are invisible to non-app-developers. If there is no user currently logged into Facebook, Facebook will act as if your sandboxed application doesn't exist at all (FB obviously doesn't know you're an app developer, and thus the app is invisible!).
This bug has been confirmed and assigned.
In which platform you are developing the application??If it is FBML then check FBJS-Facebook JavaScript.I think alert will not work in FBML application.
I got this working..Just check
<div id="fb-root"></div>
<script type="text/javascript">
window.fbAsyncInit = function() {
FB.init({appId: 'APP_ID', status: true, cookie: true, xfbml: false});
};
(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: 'APP_ID', status: true, cookie: true, xfbml: true});
/* All the events registered */
FB.Event.subscribe('auth.login', function(response) {
// do something with response
login();
});
FB.Event.subscribe('auth.logout', function(response) {
// do something with response
logout();
});
FB.getLoginStatus(function(response) {
if (response.session) {
// logged in and connected user, someone you know
login();
}
});
};
Hi
I am developing a widget that will be placed on an external website. The entire plugin has to be written in javascript. I haev searched here and there but am unable to make the facebook login button appear on the widget
My code is the following
var fbroot = document.createElement('div');
fbroot.id = "fb-root";
window.fbAsyncInit = function(){
FB.init('xxxxxxxxxxxxxxxxxx', '/xd_receiver.htm');
};
var contentRightDiv = document.createElement('div');
contentRightDiv.id = "contentrightdiv";
contentRightDiv.innerHTML = "<form><p><label>Sign in using <div id='socialmedialoginbtns'></div></label></p></form>";
var socialmedialoginbtns = document.getElementById('socialmedialoginbtns');
socialmedialoginbtns.innerHTML = '<fb:login-button show-faces="false" width="200" max-rows="1"></fb:login-button>';
If you are putting an XFBML tag on the document with javascript, use FB.XFBML.parse function to render the new tags.
Check This Code snippet....
`<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:fb="http://www.facebook.com/2008/fbml">
<body>
<div id="fb-root"></div><script type="text/javascript">`
window.fbAsyncInit = function() {
FB.init({appId: 'Your_App_ID', status: true, cookie: true, xfbml: true});
};
(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});
/* All the events registered */
FB.Event.subscribe('auth.login', function(response) {
// do something with response
getUserDetails();
login();
});
FB.Event.subscribe('auth.logout', function(response) {
// do something with response
logout();
});
FB.getLoginStatus(function(response) {
if (response.session) {
// logged in and connected user, someone you know
login();
}
});
};
</script>
<fb:login-button
autologoutlink="true"
perms="email,user_birthday,status_update,publish_stream">
</fb:login-button>
</body>
</html>