Prevent blocking popups that appear with facebook SDK - javascript

A have trouble with blocking popups which are showed by Facebook JS SDK. After reading documentation, I understand that the call of JS SDK must be after the user's click.
This code works correctly and browser don't block the popup:
function Login() {
FB.login(function (response) {
if (response.authResponse) {
DoSmth(response.authResponse.accessToken);
}
}, { scope:'user_birthday, publish_stream' });
}
But if I will use this code anywhere (for ex. post to wall, get user data), the popup will be displayed in all cases, even if user already logged in in facebook. I consider, it's not fine.
To determine, that user already logged in, I use this code:
function CheckOrLogin() {
FB.getLoginStatus(function (response) {
if (response.status === 'connected') {
DoSmth(response.authResponse.accessToken);
}
else {
FB.login(function (response) {
if (response.authResponse) {
DoSmth(response.authResponse.accessToken);
}
}, { scope:'user_birthday, publish_stream' });
}
}, true);
}
In this case popup will not be shown, if user already logged in. But if user hasn't been logged in facebook, this condition (if (response.status ===) returns false. And browser will be BLOCK popup, which will be shown by FB.login. Is there any way to prevent this?

Try to check login status at once when page loaded, and store the result and accessToken in some variable.
var userData = {isConnected: false, token: null};
FB.getLoginStatus(function (response) {
userData.isConnected = (response.status === 'connected');
if (userData.isConnected) {
userData.token = response.authResponse.accessToken;
}
}, true);
When user clicks some button – just check variable's value.
function CheckOrLogin() {
if (userData.isConnected) {
DoSmth(userData.token);
} else {
FB.login(function (response) {
if (response.authResponse) {
DoSmth(response.authResponse.accessToken);
}
}, { scope:'user_birthday, publish_stream' });
}
}

Related

FB.ui feed or share not returning post_id response

I am trying to use FB.ui share or feed on my test web site and want to get post_id on response message. App has permissions from my test user (user_posts, public_profile) and also i am checking if login status is "connected".
this is javascript code that i am trying to check login and let user to share link. shareOnFacebook() is triggered by a simple html button;
<script async defer src="https://connect.facebook.net/en_US/all.js"></script>
<script type="text/javascript">
window.fbAsyncInit = function () {
FB.init({
appId: '****************',
cookie: true,
xfbml: true,
version: 'v5.0'
});
};
function shareOnFacebook() {
FB.getLoginStatus(function (response1) {
console.log(response1)
if (response1.status === 'connected') {
FB.ui({
method: 'feed',
link: 'http://www.linktoshare.com',
picture: 'http://www.linktoshare.com/images/imagethumbnail.png'
}, function (responseEnd) {
if (responseEnd) {
console.log(responseEnd);
alert('Success');
} else {
alert('Fail');
}
});
}
else {
FB.login(function (response2) {
console.log(response2)
FB.ui({
method: 'feed',
link: 'http://www.linktoshare.com',
picture: 'http://www.linktoshare.com/images/imagethumbnail.png'
}, function (responseEnd) {
if (responseEnd) {
console.log(responseEnd);
alert('Success');
} else {
alert('Fail');
}
})
});
}
});
}
</script>
As you can see from below image, if i close pop-up, i can get response image like that;
But when i share, reponse returns as an empty array like that;
I know the error about "Https" is not important because my app is on development status.
What should i do to get post_id on response here?
Thank you very much.
What should i do to get post_id on response here?
You can’t get the post ID any more, Facebook has removed that completely.
It was getting abused by shady developers and website owners to try and force users to share stuff, to get some kind of reward - which is absolutely not allowed. To stop that kind of spam, Facebook has removed this a while ago already.

How to get any user details from facebook api

How to find user details by using his/her email ID or mobile number from Facebook? I want to get user details on my website using my app id access.
Please help me out this.
Try this. You need his facebook ID or his facebook name.
var fields = [
'id',
'name',
'first_name',
'middle_name',
'last_name',
'gender']
FB.api('/{insertIDhere}', {fields: fields}, function(details) {
// output the response
});
Or take this code from the FB Api Documentation
FB.api(
"/{user-id}",
function (response) {
if (response && !response.error) {
/* handle the result */
}
}
);
to login you need something like this :
FB.login(function(response) {
if (response.authResponse) {
//login successfull
} else {
//anything else
}
}, {scope: 'public_profile,email,user_friends'});
If you are logged in you could use something like this:
FB.api(
"/me?fields=id,name,picture.redirect(false).type(large)",
function (response) {
if (response && !response.error) {
facebookId = response.id;
facebookName = response.name;
facebookProfilePicture = response.picture.data.url;
callback(facebookUser);
}else{
}
}
);
You can't. Searching by email or phone is not possible.
https://developers.facebook.com/docs/graph-api/using-graph-api/v2.3#search

How to define scope in facebook js SDK to show user interest, movies etc?

My function is :
function CallAfterLogin()
{
FB.login(function(response)
{
if (response.status === "connected")
{
LodingAnimate(); //Animate login
FB.api('/me', function(data)
{
console.log(data);
if(data.email == null)
{
alert("You must allow us to access your email id!");
ResetAnimate();
}
else
{
AjaxResponse();
}
});
}
});
}
Instead of writing on console I want show data in browser, how can it be done?
I tried with $("#mydiv").text(data); , $("#mydiv").html(data); which dont work.
me/movies gives error :
You must allow us to access your email id
You can add the scope like this-
FB.login(function(response)
{
}, {scope: 'user_interests, user_likes, etc..'});

FB.Login opening in new window

I have this code
FB.login(function(response) {
if (response.authResponse) {
self.location.href='javascript:postToWall()';
} else {
window.top.location='https://www.facebook.com/dialog/oauth?client_id=XXXXX&redirect_uri=XXXXX&state=5140df0126eae59fbc72ac733383bda3&canvas=1&fbconnect=0&scope=email+publish_stream';
}
}, {scope: 'email,publish_stream'});
it's working but opened in pop up, i need to open it in full window. How can i do ?
You are looking at the wrong API calls. See Facebook OAuth Dialog. It is impossible to do it the way you are currently trying to.
Try this
FB.getLoginStatus(function(response)
{
if (response.status === 'connected')
{
self.location.href='javascript:postToWall()';
}
else
{
window.location.href = 'https://www.facebook.com/dialog/oauth?client_id=xxxx&redirect_uri=xxxx';
}
}, {scope: 'email,publish_stream',
return_scopes: true
});

How to request permissions for facebook app with JavaScript

How can I check the current user login status and ask for permissions for my app? This recently changed and now my app is not working anymore. Thanks for your help!
I always use this setup to handle login status and permissions:
function getPerms() {
FB.login(function(response) {
if (response.authResponse) {
//user has granted permissions
}
}, {scope:"email, ..."});
}
function getStatus() {
FB.getLoginStatus(function(response) {
if (response.status === "connected") {
//user has granted permissions
} else {
getPerms();
}
});
}
You still have to include the all.js and call FB.init(...)
Here is how you can do that:
FB.init(
{
"appId" : xxxxxxxxxx,
"status" : true,
"cookie" : true,
"xfbml" : true,
"oauth" : true
});
FB.Event.subscribe('auth.authResponseChange', function(response)
{
// need to wait few seconds for fb login status to work in FireFox
setTimeout('window.location.reload()', 3000);
});
function fbConnect(){
FB.getLoginStatus(function(response) {
if (response.authResponse){
FB.login(function(response)
{
if (response.authResponse) { }
else
{
//console.log('User cancelled login or did not fully authorize.');
}
}, {"scope":"email,manage_pages"});
}
});
}
You need to call fbConnect() function.
Also make sure that you have these below <body> tag on your page:
<div id="fb-root"></div>
<script src="//connect.facebook.net/en_US/all.js"></script>
You need to provide some code to get better/accurate answers
Most likely you didn't upgrade your code to use OAuth 2.0, see here
Based on the link above, use scope instead of perms
Use response.authResponse instead of response.session
Welcome to Stackoverflow!

Categories

Resources