Api of facebook is blinking when getting user information - javascript

Currently make the connection to the facebook api with php, create a project in facebook developers, generate the corresponding keys and as for the permissions of users I'm using the default and the permission of the mail, allows me to enter and give permission to the application but sometimes does not bring all the user information and some times when you click the button facebook does not open the popup to log in with facebook or give permission to the application with my account, sometimes if not, I do not know why and the case is still very intermittent, in the browser console does not tell me that is due to the intermittence, something important to mention is that the day if there is a high flow of people trying to use the login with facebook but the intermittent can not be logged in, I have this script in html before the body:
window.fbAsyncInit = function () {
FB.init({
appId: '<?php echo $UrlApiFacebook; ?>',
cookie: true, // Enable cookies to allow the server to access the session.
autoLogAppEvents : true,
xfbml: true, // Parse social plugins on this webpage.
version: 'v7.0' // Use this Graph API version for this call.
});
};
(function(d, s, id) { // Load the SDK asynchronously
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 checkLoginState() {
FB.getLoginStatus(function (response) { // Called after the JS SDK has been initialized.
statusChangeCallback(response, 1); // Returns the login status.
});
}
For this code I rely directly on the official documentation of facebook developer, in another javascript file is the function 'statusChangeCallback()' this file is like this:
function statusChangeCallback(response, i) {
console.log('statusChangeCallback');
console.log(response);
if (i == 3) {
if (response.status === 'connected') { // Logged into your webpage and Facebook.
FB.logout(function (response) {
window.location.href = "login_out.php";
});
} else {
window.location.href = "login_out.php";
}
} else {
if (response.status === 'connected') { // Logged into your webpage and Facebook.
testAPI();
} else { // Not logged into your webpage or we are unable to tell.
console.log("No logueado");
FB.login(function (response) {
if (response.status === 'connected')
testAPI();
});
}
}
}
function testAPI() { // Testing Graph API after login. See statusChangeCallback() for when this call is made.
console.log('Welcome! Fetching your information.... ');
FB.api('/me', { fields : 'name,picture,first_name,last_name,email' }, function (response) {
console.log('Successful login for: ' + response.name);
onSendDataFacebook(response);
});
}
function logoutUserFacebook() {
FB.getLoginStatus(function (response) { // Called after the JS SDK has been initialized.
statusChangeCallback(response, 3); // Returns the login status.
});
}
function onSendDataFacebook(userFacebook) {
let email = "";
let name = "";
let last_name = "";
var user = {
id: userFacebook.id, nombre: userFacebook.name,
email: userFacebook.email,
nombrecompleto: userFacebook.first_name + ' ' + userFacebook.last_name,
llamado: redir,
veces: x
}
if(!userFacebook.email){
user.email = email;
}
if(!userFacebook.name){
user.name = name;
}
if(!userFacebook.first_name || !userFacebook.last_name){
user.first_name = name;
user.last_name = last_name;
}
redireclogin(user);
}
I would very much appreciate the help of anyone who knows what this intermission is about, thank you in advance.

Related

Facebook - Invalid Scopes: manage_pages

Can anyone help me to understand why i getting this error when i try to use Facebook SDK login button and ?
Invalid Scopes: manage_pages. This message is only shown to developers. Users of your app will ignore these permissions if present. Please read the documentation for valid permissions at: https://developers.facebook.com/docs/facebook-login/permissions
This is the HTML:
<fb:login-button scope="manage_pages" onlogin="checkLoginState();"></fb:login-button>
This is the JS:
// This is called with the results from from FB.getLoginStatus().
function statusChangeCallback(response) {
console.log('statusChangeCallback');
console.log(response);
window.facebook = {user_data: 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();
getUserPages();
} else {
// The person is not logged into your app or we are unable to tell.
document.getElementById('status').innerHTML = 'Please log ' +
'into this app.';
}
}
// 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 : '<app_id>',
cookie : true, // enable cookies to allow the server to access
// the session
xfbml : true, // parse social plugins on this page
version : 'v2.12' // use graph api version 2.8
});
// 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);
});
FB.AppEvents.logPageView();
};
// 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 = "https://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() {
showLog('Welcome! Fetching your information.... ');
FB.api('/me', function(response) {
console.log('Successful login for: ' + response.name);
document.getElementById('status').innerHTML =
'Thanks for logging in, ' + response.name + '!';
});
}
// Here we run a very simple test of the Graph API after login is
// successful. See statusChangeCallback() for when this call is made.
function getUserPages() {
showLog('getUserPage');
FB.api(
'/'+window.facebook.user_data.authResponse.userID+'/accounts',
'GET',
{},
function(response) {
showLog(response);
if (response.data != undefined && response.data.length > 0){
window.facebook.user_data.pages = response.data
getPagesReviews()
}
}
);
}
It's use to work like one month ago.
Thank for the help :)
just remove manage_pages from the scope and it will work
`<fb:login-button size="large" scope="public_profile,email,pages_show_list,read_insights,manage_pages"
onlogin="checkLoginState();"> Click here to sync </fb:login-button>`
to
`<fb:login-button size="large" scope="public_profile,email,pages_show_list,read_insights"
onlogin="checkLoginState();"> Click here to sync </fb:login-button>`

How to get user feeds from facebook using angular js.

I had referred many articles but It couldnt solve this issue. Im trying to get the user feeds from facebook.How can i get it.
Here is my code:
var newMod = angular.module('newapp', []);
newMod.controller('mainCtrl', function ($scope) {
window.fbAsyncInit = function () {
//SDK loaded, initialize it
FB.init({
appId: 'your app id',
xfbml: true,
version: 'v2.3'
});
//check user session and refresh it
FB.getLoginStatus(function (response) {
if (response.status === 'connected') {
//user is authorized
document.getElementById('loginBtn').style.display = 'none';
getUserData();
} else {
//user is not authorized
}
});
function getUserData() {
FB.api('/me', function (response) {
document.getElementById('response').innerHTML = 'Hello ' + response.name;
document.getElementById('dialog_div').style.border = '1px solid red';
document.getElementById('dialog_div').innerHTML = response;
});
}
};
//load the JavaScript SDK
(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'));
$scope.loginClick = function () {
FB.login(function (response) {
if (response.authResponse) {
//user just authorized your app
document.getElementById('loginBtn').style.display = 'none';
getUserData();
}
}, { scope: 'email,public_profile', return_scopes: true });
}
});
my html code:
<body ng-app="newapp">
<div ng-controller="mainCtrl">
<button id='loginBtn' ng-click="loginClick()" >FacebookLOGin</button>
<div id="response"></div>
<div id="dialog_div"></div>
</div>
from getuserdata() Im able to get the user details. Now how to access the user feeds. I had tried to use the below code but it outputs empty array.
FB.api("/me/feed",function(response){
if(response !="" ){
// access the feed data
}
})
Can anyone explain me the way to get the user feeds after user login.
I got to know the mistake that was done.
Here the session will be expired when the person tries to access the feeds.
So include the FB.api('/me/feed',function(response){}) in the code section FB.login(function(response) {})
Now the session will be able to access the userfeeds.
Your app needs the user_posts to get the user's feed. The /user/feed doc explains that pretty well. In any case, you need to implement facebook login, ask for user_posts permission from your user and go from them to get the user's feed.

Track canceled facebook login

I wish to track users which were presented with the Facebook Login dialog popup, and chose to close it (by clicking "cancel" or just closed the popup window).
I am using Facebook SDK and invoking FB.login()
From the docs it's unclear, but it does appear there might be some way to track this, so, if anyone here knows how, or can help, it would be appriciated. Thanks!
complete code:
var facebook = (function(){
// Configuration
var serverDomain = '365scores.com',
appID = '158698534219579';
// 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'));
window.fbAsyncInit = function(){
FB.init({
appId : appID,
cookie : true, // enable cookies
xfbml : true, // parse social plugins on this page
version : 'v2.0' // use version 2.0
});
FB.getLoginStatus(FBLoginStatus);
FB.Event.subscribe('auth.authResponseChange', FBLoginStatus);
};
function FBLoginStatus(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.
//connected(response);
$(document).trigger('connection', ['facebook', response]);
}
else if( response.status === 'not_authorized' ){
// 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.
}
};
function checkLoginState() {
FB.getLoginStatus(function(response) {
FBLoginStatus(response);
});
}
function connected(res){
console.log( res )
console.log('FACEBOOK CONENCTED');
/*
FB.api('/me', function(response){
});
*/
}
return FBLoginStatus;
})();
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 + '.');
});
} else {
console.log('User cancelled login or did not fully authorize.');
}
});

How to redirect user after facebook login

I am developing a game which requires user to login and then uses the login details to update the leaderboard. But the problem is that after the user logs in, the login dialog does not get closed automatically and the user is not redirected to the game. Here is the code which is taken from here
window.fbAsyncInit = function() {
FB.init({
appId : 'XXXXXXXXXX',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
FB.Event.subscribe('auth.authResponseChange', function(response) {
shepResponse = response;
// Here we specify what we do with the response anytime this event occurs.
if (response.status === 'connected')
testAPI();
}
else if (response.status === 'not_authorized') {
FB.login();
} else {
FB.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 = "http://connect.facebook.net/en_US/all.js";
ref.parentNode.insertBefore(js, ref);
}(document));
function testAPI() {
console.log('Welcome! Fetching your information.... ');
FB.api('/me', function(response) {
console.log('Good to see you, ' + response.name + '.');
});
}
try not wrapping FB.Event.subscribe and testAPI() inside the fbAsyncInit function.
Also try auth.statusChange instead of auth.authResponseChange
var fb_handleStatusChange = function(response) {
if (response.authResponse) {
// user logged in
} else {
// not logged in or logged out
}
}
FB.Event.subscribe('auth.statusChange', fb_handleStatusChange);
Also, i think that the login redirect should be to a page that has this code and is listening for status change. I would not redirect back to the same page as the one used for login.

Hosting Facebook apps on Dropbox

I'm trying to host a simple JS based Facebook app on dropbox following this question:
Server required for a Facebook application?
Currently I just want to get the login part done before I can continue but i'm having some issues - apparently the call for FB.getLoginStatus doesn't return so the actual login function isn't called.
If I call login() directly (currently commented out) I manage to log into Facebook but then the call FB.api('/me', function(response) {...}) doesn't return so I'm logged in but can't really do anything.
What am I missing? I've set the correct URLs in my Facebook's app page and I really don't know what I'm doing wrong, why does it have to be so hard? :/
Here is my JS code (pretty much copy+paste from Facebook login tutorial) and the HTML is exactly copy+paste from that tutorial.
// Additional JS functions here
function testAPI() {
document.write('Welcome! Fetching your information.... </br>');
FB.api('/me', function(response) {
document.write('Good to see you, ' + response.name + '.</br');
});
}
function login() {
document.write('Logging to Facebook </br>');
FB.login(function(response) {
if (response.authResponse) {
// connected
document.write("User now connected </br>");
testAPI();
} else {
// cancelled
document.write("User cancelled </br>");
}
});
}
window.fbAsyncInit = function() {
document.write("Connecting to facebook </br>");
FB.init({
appId : '542474505763387', // App ID
channelUrl : 'https://dl-web.dropbox.com/get/index.html?w=71a3a216', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
//login();
FB.getLoginStatus(function(response) {
document.write("Response </br>");
if (response.status === 'connected') {
// connected
document.write("connected </br>");
} else if (response.status === 'not_authorized') {
// not_authorized
document.write("not_authorized </br>");
login();
} else {
// not_logged_in
document.write("not_logged_in </br>");
login();
}
});
};
// 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>

Categories