I'am trying to get the Login button from Facebook to work on my website using the Javascript SDK. If the user is logged on, I get the email address back. This works. But on the page where I have my Facebook Login button, I also have the normal login for my website. (username & password). But when I go to my login page, the page automatically loads the Facebook button and the Facebook login dialog appears. But I don't want to load this button automatically. I want that users always have to press the login button for Facebook. Is this possible?
This is my code:
<script>
window.fbAsyncInit = function() {
FB.init({
appId: 'MY_APP_ID', // App ID
status: true,
cookie: true,
xfbml: true,
oauth: true,
});
FB.getLoginStatus(function(response) {
FB.login(function(response) {
if (response.authResponse) {
FB.api('/me', function(response) {
alert('Good to see you, ' + response.email + '.');
});
} else {
alert('User cancelled login or did not fully authorize.');
}
});
});
// Additional initialization code here
};
// 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 = "//connect.facebook.net/en_US/all.js";
d.getElementsByTagName('head')[0].appendChild(js);
}(document));
</script>
FB.getLoginStatus method is used to know whether user has logged in or not
FB.login is used to prompt login page to authenticate and authorize the app.
you are calling FB.getLoginStatus method and not bothering about the response and firing fb.login button always.
If you always want user to click login button don't use FB.getLoginStatus
Use this code
<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
});
};
// 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 class="fb-login-button">Login with Facebook</div>
</body>
</html>
FYI: https://developers.facebook.com/docs/guides/web/
check authentication section
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