Call function only when log in is made - javascript

I'm trying to implement a login with Facebook JavaScript SDK and PHP, so when user successfully logs in it send an AJAX request to set $_SESSION. To start I used example code from docs, but this just loops the function that sends the AJAX request, where could I get only when user logins for first time.
function statusChangeCallback(response) {
if (response.status === 'connected') {
login_FBAuth();
} else if (response.status === 'not_authorized') {
document.getElementById('status').innerHTML = 'Please log ' +
'into this app.';
} else {
document.getElementById('status').innerHTML = 'Please log ' +
'into Facebook.';
}
}
function checkLoginState() {
FB.getLoginStatus(function (response) {
statusChangeCallback(response);
});
}
window.fbAsyncInit = function () {
FB.init({
appId: 'secret',
cookie: true,
xfbml: true,
version: 'v2.5'
});
FB.getLoginStatus(function (response) {
statusChangeCallback(response);
});
};
// Load the SDK asynchronously
(function (d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id))
return;
js = d.createElement(s);
js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
function login_FBAuth() {
FB.api('/me', function (response) {
$.ajax({
url: 'auth/fb_login.php',
method: 'POST',
data: {action: 'login', nombre: response.name},
success: function (server_response) {
console.log("Me fui y encontre el servidor");
console.log("El servidor responde" + server_response);
if (server_response === 'ok') {
console.log('Respuesta correcta');
window.location.href = "appmenu.php";
}
},
error: function () {
console.log("Error en respuesta servidor");
}
});
});
}
HTML
<fb:login-button scope="public_profile, email, user_posts, publish_actions" onlogin="checkLoginState();"></fb:login-button>
<div id="status"></div>

Related

Window.fbAsyncInit is not accessed

I have a script in file cshtml to use facebook API, but function window.fbAsyncInit is not called. How can I call this func?
This function show "flag 1" in console but flag 2 is not
<div onclick="likeb()">1</div>
function likeb() {
console.log("flag 1");
window.fbAsyncInit = function () {
FB.init({
appId: '295590887998480',
cookie: true,
xfbml: true,
version: 'v3.3'
});
FB.getLoginStatus(function (response) {
statusChangeCallback(response);
});
FB.login(function (response) {
if (response.authResponse) {
console.log('Welcome! Fetching your information.... ');
} else {
console.log('User cancelled login or did not fully authorize.');
}
}, { scope: 'user_likes,user_photos,user_link,user_posts,user_friends,publish_to_groups,manage_pages' });
FB.login(function (response) {
FB.api(
'/me/feed', 'post',
{ "message": "Hé lô mấy bạn ;)" },
function (response) {
console.log(response);
}
);
}, { scope: 'user_likes,user_photos,user_link,user_posts,user_friends,publish_to_groups,manage_pages' });
console.log("flag 2");
};
(function (d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) { return; }
js = d.createElement(s); js.id = id;
js.src = "https://connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
function statusChangeCallback(response) {
if (response.status === 'connected') {
console.log('Logged in and authenticated');
} else {
console.log('Not authenticated');
}
}
}
This function show "flag 1" in console but flag 2 is not

Get user email from facebook connect with SDK java script in v2.8

I can not retrieve the facebook e-mail address of a person who connects with the facebook login button. I use JDK java script in 2.8 version
<fb:login-button scope="public_profile,email" onlogin="checkLoginState();" auto_logout_link="true"></fb:login-button>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '<appId>',
xfbml : true,
version : 'v2.8'
});
FB.AppEvents.logPageView();
};
(function(d, s, id){
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_FR/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
function checkLoginState() {
FB.getLoginStatus(function(response) {
//console.log('Check login state');
//console.log(response);
statusChangeCallback(response);
});
}
function statusChangeCallback(response) {
if (response.status === 'connected') {
console.log('Connected');
testAPI();
} else if (response.status === 'not_authorized') {
console.log('Please log into this app');
} else {
console.log('Please log into Facebook.');
}
}
function testAPI() {
FB.login(function(response) {
if (response.authResponse) {
var access_token = response.authResponse.accessToken;
FB.api(
'/me',
{fields: 'id,email,cover,name,first_name,last_name,age_range,link,gender,locale,picture,timezone,updated_time,verified'},
function (response) {
console.log('response');
console.log(response);
}
);
} else {
console.log('User cancelled login or did not fully authorize.');
}
},{scope:'email'});
}
function testLogout() {
FB.logout(function(response) {
console.log(response);
});
}
</script>
I have all the information except the email. Can you help me please ?
Change:
FB.api(
'/me',
{fields: 'id,email,cover,name,first_name,last_name,age_range,link,gender,locale,picture,timezone,updated_time,verified'},
function (response) {
console.log('response');
console.log(response);
}
);
To:
FB.api(
'/me?fields=id,email,cover,name,first_name,last_name,age_range,link,gender,locale,picture,timezone,updated_time,verified',
function (response) {
console.log('response');
console.log(response);
}
);

Connecting Facebook on an application

Everytime I log out my account on Facebook itself, the connected account (same account) in the app also logs out. Is this expected?
I was hoping to come up with something like Hootsuite's functionalities, starting with Facebook first.
Here is my code.
<div id="fb-root"></div>
<script>
var app_id='{!#SETTINGS.facebook_api_key#value}';
function statusChangeCallback(response) {
console.log('statusChangeCallback');
console.log(response);
if (response.status === 'connected') {
console.log('The user is connected.');
var fb_access_token = response.authResponse.accessToken;
console.log(fb_access_token);
rbf_setFieldValue("facebook_access_token", fb_access_token);
} else if (response.status === 'not_authorized') {
console.log('The user is not authorized.');
} else {
console.log('The user is not logged in.');
FB.login(function(response) {
console.log('Logging in.');
var fb_access_token = response.authResponse.accessToken;
console.log(fb_access_token);
rbf_setFieldValue("facebook_access_token", fb_access_token);
}, {scope: 'public_profile, manage_pages, publish_actions, user_groups'});
}
}
function checkLoginState() {
FB.getLoginStatus(function(response) {
statusChangeCallback(response);
});
}
window.fbAsyncInit = function() {
FB.init({
appId : app_id,
cookie : true,
xfbml : true,
version : 'v2.1'
});
FB.getLoginStatus(function(response) {
statusChangeCallback(response);
});
};
// Load the SDK asynchronously
(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
Got it.
My mistake was I used FB.ui for posting to Facebook, and it requires a Facebook account to post.
The solution was to use FB.api and pass the user/page access token so that you can post without user login.
function postToSocialTimeline() {
try {
var obj = {
name: name,
description: description,
link: link,
picture: picture,
caption: caption,
message: "Test",
access_token: accessCode
};
function resp(response) {
console.log('Cancelled');
} //FB.ui(obj, resp);
FB.api('/me/feed', 'POST', obj, function(response) {
if (!response || response.error) {
console.log(!response ? 'error occurred' : response.error);
console.log('Error');
alert('Unable to post to Facebook!');
return;
} else {
alert('Requisition has been successfully posted!');
}
});
} catch (e) {}
}

How to login using Facebook account?

I have been through this link and tried the code.
I am doing the same thing but there is no response coming from Facebook. No popup (not blocked). My code is given below:
<div id="fb-root"></div>
<script>
// Additional JS functions here
window.fbAsyncInit = function() {
FB.init({
appId : 'myappid', // App ID
channelUrl : '//myurl/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
});
FB.getLoginStatus(function(response) {
alert("Response");
alert("getloginstatus");
if (response.status === 'connected') {
// connected
} else if (response.status === 'not_authorized') {
// not_authorized
login();
} else {
// not_logged_in
login();
}
});
};
(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);
alert("Lodaed SDK");
}(document));
function testAPI() {
console.log('Welcome! Fetching your information.... ');
FB.api('/me', function(response) {
alert("Good to see you, " + response.name + ".");
});
}
function login() {
FB.login(function(response) {
if (response.authResponse) {
// connected
} else {
// cancelled
}
});
}
</script>
</div>
Please tell me what I am doing wrong. I yea, I have not any checkbox in
Select how your app integrates with Facebook.
during creating Facebook app. If I have to define url so what I have given?
<script>
// This is called with the results from from FB.getLoginStatus().
function statusChangeCallback(response) {
console.log(response);
// The response object is returned with a status field that lets the
// app know the current login status of the person.
// Full docs on the response object can be found in the documentation
// for FB.getLoginStatus().
if (response.status === 'connected') {
// Logged into your app and Facebook.
testAPI();
} else if (response.status === 'not_authorized') {
// The person is logged into Facebook, but not your app.
console.log("The person is logged into Facebook, but not your app.");
} else {
// The person is not logged into Facebook, so we're not sure if
// they are logged into this app or not.
}
}
// This function is called when someone finishes with the Login
// Button. See the onlogin handler attached to it in the sample
// code below.
function checkLoginState() {
FB.getLoginStatus(function(response) {
statusChangeCallback(response);
});
}
window.fbAsyncInit = function() {
FB.init({
appId: '{Your App Id}',
cookie: true, // enable cookies to allow the server to access
// the session
xfbml: true, // parse social plugins on this page
version: 'v2.2' // use version 2.2
});
// Now that we've initialized the JavaScript SDK, we call
// FB.getLoginStatus(). This function gets the state of the
// person visiting this page and can return one of three states to
// the callback you provide. They can be:
//
// 1. Logged into your app ('connected')
// 2. Logged into Facebook, but not your app ('not_authorized')
// 3. Not logged into Facebook and can't tell if they are logged into
// your app or not.
//
// These three cases are handled in the callback function.
FB.getLoginStatus(function(response) {
statusChangeCallback(response);
});
};
// Load the SDK asynchronously
(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s);
js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
// Here we run a very simple test of the Graph API after login is
// successful. See statusChangeCallback() for when this call is made.
function testAPI() {
console.log('Welcome! Fetching your information.... ');
FB.api('/me', function(response) {
console.log("Fb response");
console.log(response);
console.log('Successful login for: ' + response.name);
document.getElementById('status').innerHTML =
'Thanks for logging in, ' + response.name + '!';
});
}
</script>
In Body , use :-
<fb:login-button scope="public_profile,email" onlogin="checkLoginState();">
</fb:login-button>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title></title>
<link rel="stylesheet" type="text/css" href="">
</head>
<body>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '1736082853383409',
xfbml : true,
version : 'v2.8'
});
FB.getLoginStatus(function(response){
if(response.status === 'connected'){
document.getElementById('status').innerHTML = 'we are connected';
} else if(response.status === 'not_authorized') {
document.getElementById('status').innerHTML = 'we are not logged in.'
} else {
document.getElementById('status').innerHTML = 'you are not logged in to Facebook';
}
});
// FB.AppEvents.logPageView();
};
(function(d, s, id){
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
function login(){
FB.login(function(response){
if(response.status === 'connected'){
document.getElementById('status').innerHTML = 'we are connected';
} else if(response.status === 'not_authorized') {
document.getElementById('status').innerHTML = 'we are not logged in.'
} else {
document.getElementById('status').innerHTML = 'you are not logged in to Facebook';
}
});
}
// get user basic info
function getInfo() {
FB.api('/me', 'GET', {fields: 'first_name,last_name,name,id'}, function(response) {
document.getElementById('status').innerHTML = response.id;
});
}
function logout(){
FB.logout(function(response) {
document.location.reload();
});
}
</script>
<div id="status"></div>
<!-- <button onclick="getInfo()">Get Info</button> -->
<button onclick="login()">login</button>
<button onclick="logout()">logout</button>
</body>
</html>
Use this code or follow https://github.com/radhey113/facebook_login/blob/master/index1.html
window.fbAsyncInit = function() {
FB.init({
appId : '1557876490891744',
appSecret : '302f28b9110351071840458316ce232f',
xfbml : true,
version : 'v2.5'
});
FB.getLoginStatus(function(response) {
if (response.status === 'connected') {
document.getElementById('status').innerHTML = 'We are connected.';
document.getElementById('login').style.visibility = 'hidden';
} else if (response.status === 'not_authorized') {
document.getElementById('status').innerHTML = 'We are not logged in.'
} else {
document.getElementById('status').innerHTML = 'You are not logged into Facebook.';
}
});
};
(function(d, s, id){
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
// login with facebook with extened publish_actions permission
function login() {
FB.login(function(response) {
console.log(response);
if (response.status === 'connected') {
document.getElementById('status').innerHTML = 'We are connected.';
document.getElementById('login').style.visibility = 'hidden';
} else if (response.status === 'not_authorized') {
document.getElementById('status').innerHTML = 'We are not logged in.'
} else {
document.getElementById('status').innerHTML = 'You are not logged into Facebook.';
}
}, {scope: 'publish_actions'});
}
// getting basic user info
function getInfo() {
FB.api('/me', 'GET', {fields: 'first_name,last_name,name,id'}, function(response) {
document.getElementById('status').innerHTML = response.id;
});
}
// uploading photo on user timeline
function uploadPhoto() {
FB.api('/me/feed', 'post', {source: 'http://lh3.googleusercontent.com/nYhPnY2I-e9rpqnid9u9aAODz4C04OycEGxqHG5vxFnA35OGmLMrrUmhM9eaHKJ7liB-=w300', message : "SHOWDOWN POST",link:'http://54.175.71.74:3000'}, function(response) {
if (!response || response.error) {
console.log(JSON.stringify(response));
document.getElementById('status').innerHTML = "Error!";
} else {
console.log(JSON.stringify(response));
document.getElementById('status').innerHTML = response.id;
}
});
}
function uploadFeed(imgUrl, des) {
console.log("img Url-------- " + imgUrl);
$scope.loaderOverlay = false;
var linkPage = 'http://playshowdown.com/feed?categoryName='+vm.stateType.categoryName+'&id='+ vm.stateType._id +
'&type='+vm.stateType.type + '&feedType='+vm.stateType.feedType;
FB.ui({
method: 'share_open_graph',
action_type: 'og.shares',
action_properties: JSON.stringify({
object: {
'og:url': linkPage,
'og:title': "Play Showdown",
'og:description': des,
'og:image': imgUrl
}
})
},
function (response) {
console.log(response);
// if(response.post_id){
if(response.error_code != 4201){
vm.areYouSure = false;
$timeout(function(){
$('.overlay').show();
$('#congract4').show();
},1000);
console.log("post response1: " + JSON.stringify(response));
}
// }
// Action after response
})
}
function readPermission() {
FB.api(
"/debug_token?input_token=EAAWI4WLX8eABAJHx3al6NIi2pLM7ZCZBXEgFUOp2gJQ3VOh7gRbLSdZBZAJgmjcuYcYT7jaqO4mrkOyUeCI2q8kuZBqZCzJajjEqPjsZAFzFnHJPhWWozOGqKRZCCvTARTOS67G04cUyeYi9RAZBSZCrZA1Jq6FOmiyksFnhSKkEaFHOQQbZB5siATE9AQCU7prTGv0ZD",
function (response) {
console.log(response)
if (response && !response.error) {
/* handle the result */
}
}
);
}

Facebook Login infinite loop

I got a Problem with the Facebook Login on my page.
First I tried it with only FB.Login but then i get following message: "FB.login() called when user is already connected."
So I added FB.getLoginStatus But now it keeps loggin me in, in a infinite loop. Even if i'm logged (into my system) and without me clicking on the FB-Connect Button.
How can I achieve it to not log me in until I click the FB-connect Button?
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/fb_LT/all.js#xfbml=1&appId=198866780209581";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
window.fbAsyncInit = function() {
FB.init({
appId : "198866780209581", // App ID
status : true,
cookie : true,
xfbml : true,
oauth : true,
});
var login = false;
FB.getLoginStatus(function(response) {
if (response.status === 'connected') {
console.log('connected');
login=true;
$.ajax({
type: "POST",
url: "/?eID=login&modus=facebook&fb-login=1",
data: $(this).serialize(),
success: function(msg) {
console.log("LOGIN");
window.location.reload();
}
})
var uid = response.authResponse.userID;
var accessToken = response.authResponse.accessToken;
}
else{
FB.login(function(response) {
if (response.authResponse) {
console.log('Welcome! Fetching your information.... ');
FB.api('/me', function(response) {
console.log('Good to see you, ' + response.name + '.');
if(login===false)
{
alert('nicht connected');
}
});
} else {
console.log('User cancelled login or did not fully authorize.');
}
}, {scope: 'email'});
}});
// Additional initialization code here
};
</script>
The solution was to change the click function like this:
$(".fb-login-button").live("click", function() {
}
My final code looks like this:
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/fb_LT/all.js#xfbml=1&appId=198866780209581";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
window.fbAsyncInit = function() {
FB.init({
appId : "198866780209581", // App ID
status : true,
cookie : true,
xfbml : true,
oauth : true,
});
var login = false;
$(".fb-login-button").live("click", function() {
FB.getLoginStatus(function(response) {
alert('hier 1');
if (response.status === 'connected') {
alert('connected');
console.log('connected');
login=true;
$.ajax({
type: "POST",
url: "/?eID=login&modus=facebook&fb-login=1",
data: $(this).serialize(),
success: function(msg) {
console.log("LOGIN");
window.location.reload();
}
})
var uid = response.authResponse.userID;
var accessToken = response.authResponse.accessToken;
}
else{
alert('im else');
FB.login(function(response) {
if (response.authResponse) {
console.log('Welcome! Fetching your information.... ');
FB.api('/me', function(response) {
console.log('Good to see you, ' + response.name + '.');
if(login===false)
{
alert('nicht connected');
}
});
} else {
console.log('User cancelled login or did not fully authorize.');
}
}, {scope: 'email'});
}});
});
// Additional initialization code here
};

Categories

Resources