Facebook comment integration failure - facebook

I am doing facebook integeration. When I login, the widget does not reload. Because of that I am unable to post comments. When I reload the window it works fine. What I am doing wrong?
I am using the code below.
<script>
window.fbAsyncInit = function() {
FB.init({ appId: '217419501642964',
status: true,
cookie: true,
xfbml: true,
channelUrl:'https://creator.zoho.com/channel.html'});
_ga.trackFacebook();
};
(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>
TIA
Log

Try rerendering the XFBML after the login:
FB.Event.subscribe('auth.login', function(response) {
FB.XFBML.parse(document.getElementById('myfblogin'));
// where myfblogin is the id of your <fb:login-button> element
});

Related

Facebook Connect Button - page is multi-refresh

I would like to login to my website by facebook connect but I have problem with facebook connect BUTTON. When I click in this button, i'm login but then the page is multi-refresh.
This is my code:
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId: 'xxxxxyyyxxxx',
cookie: true,
xfbml: true,
oauth: true
});
FB.Event.subscribe('auth.authResponseChange', function(response) {
if (response.status === 'connected') {
window.top.location = 'http://mystite.pl/login.php?mode=fb_login';
}
});
};
(function() {
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol +
'//connect.facebook.net/pl_PL/all.js';
document.getElementById('fb-root').appendChild(e);
}());
</script>
Where is problem?
As far as I am concerned, there is a page refresh after logging in to fb via js sdk (not 100% sure).
And you have there another refresh
FB.Event.subscribe('auth.authResponseChange', function(response) {
if (response.status === 'connected') {
window.top.location = 'http://mystite.pl/login.php?mode=fb_login';
}
});

facebook login button onclick event

I am add login button as shown below,but something go wrong. First two times I get facebook login window,but then something fails. When login window starts open it closed.When I step by step trace functions invoking I find thet onConnect() function is not invoking.Any ideas?
my View:
<script type="text/javascript">
$(document).ready(function () {
if (document.getElementById('fb-root') != undefined) {
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: '455724271129246', status: true, cookie: false, xfbml: true, oauth: true });
};
function onConnect() {
FB.getLoginStatus(function (response) {
if (response.session) {
window.location = "../LogOn/FbLogin?token=" + response.session.access_token;
} else {
// if user cancel
}
});
};
</script>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml">
<body>
<div id="fb-root"></div>
<fb:login-button perms="email,user_checkins"
onlogin="onConnect();" autologoutlink="false">
</fb:login-button>
</body>
my controller:
public ActionResult FbLogin(string token)
{
WebClient client = new WebClient();
string JsonResult = client.DownloadString(string.Concat("https://graph.facebook.com/me?access_token=", token));
JObject jsonUserInfo = JObject.Parse(JsonResult);
UInt64 facebook_userID = jsonUserInfo.Value<UInt64>("id");
string username = jsonUserInfo.Value<string>("username");
string email = jsonUserInfo.Value<string>("email");
ViewData["email"] = email;
return View();
}
Try adding a subscribe event:
FB.Event.subscribe('auth.login', function (response) {
//do whatever
login();
// or onConnect();
});
FB.Event.subscribe('auth.logout', function (response) {
//do whatever
logout();
});

New Facebook API issue

Can anyone help me with this code and tell me what is wrong?
My code is not working anymore with the new Facebook API and I am getting the below errors!
Uncaught Error: OAuth2 specification states that 'perms' should now be called
'scope'. Please update.
Error is in http://connect.facebook.net/en_US/all.js line 23
And even if I changed it, it still does not work at all!
//THIS FUNCTION WILL INITIALIZE THE FACEBOOK API AND WILL ADD NEW FACEBOOK ACCOUNTS.
var apikey = $("#apikey").val();
//var tuittingID = $("#tuittingID").val();
FB.init({ apiKey: apikey, status : true, cookie : true, oauth: true });
FB.getLoginStatus(handleSessionResponse);
$('#FBlogin').live('click', function() {
FB.login(handleSessionResponse, {
scope:'manage_pages, publish_stream, offline_access, user_status,
read_insights'
});
return false;
});
function handleSessionResponse(response) {
if (!response.session || String(response.scope) == '') {
return;
}
else
var tuittingID = $.cookie("tuittingID");
$('#AccessToken').val(response.session.access_token);
$("#loader").show();
$.post("tuitting/facebook_lib/fbadd.php",
{ tuittingID: tuittingID, uid: FB.getSession().uid, usid:
FB.getSession().session_key, accesstoken: response.session.access_token },
function(data){
reloadAccounts();
$("#loader").hide();
FB.logout(function(response) {
}); //END LOGOUT FROM FACEBOOK AFTER SUCCESSFULL ACTION
}
); //END AJAX POST FUNCTION DATA
}
Did you make the changes needed to support Oauth 2? it's been mandatory since Oct 1st but the SDKs were only forced onto Oauth 2 yesterday (December 13 2012)
See https://developers.facebook.com/docs/oauth2-https-migration/ - there's a summary of what changed and links to the announcing blog posts - the authentication and javascript docs are the docs you're most likely to need to check if you're making changes as this is where the changes were
We were also affected by this change and we made the following changes to make it work.
FB.init() was required as coded below with oauth set as true.
FB.init({
appId: 1234567890123,
oauth: true
})
And now there is no more session, response.session becomes response.authResponse and response.session.uid becomes response.authResponse.userID
FB.login(function(response) {
if (response.authResponse) {
var postData = {
FBID: response.authResponse.userID,
Access_Token: response.authResponse.accessToken
};
Link with additional information on js changes required
https://developers.facebook.com/blog/post/525/
Also make sure you're using FB.getAuthResponse() instead of FB.getSession().
http://developers.facebook.com/docs/reference/javascript/FB.getAuthResponse/
http://developers.facebook.com/blog/post/525/
This is the Oauth 1.0 code:
html
<div id="fb-root"></div>
<div class="fb-login-button" scope="email,user_birthday"
onlogin="afterFacebookConnect();" autologoutlink="false">Login con Facebook</div>
javascript
window.fbAsyncInit = function () {
FB.init({
appId: 'id_of_app',
status: true,
cookie: true,
xfbml: true });
};
if (document.getElementById('fb-root') != undefined) {
var e = document.createElement('script');
e.type = 'text/javascript';
e.src = document.location.protocol + '//connect.facebook.net/es_ES/all.js';
e.async = true;
document.getElementById('fb-root').appendChild(e);
}
function afterFacebookConnect() {
FB.getLoginStatus(function (response) {
if (response.session) {
window.location = "/facebook/login?token=" + response.session.accessToken;
} else {
// user clicked Cancel
}
});
}
Changes I made to adapt to Oauth 2.0:
window.fbAsyncInit = function () {
FB.init({
appId: 'id_of_app',
status: true,
cookie: true,
xfbml: true,
oauth:true // additional parameter
});
};
function afterFacebookConnect() {
FB.getLoginStatus(function (response) {
if (response.authResponse) {
window.location = "/facebook/login?token="
+ response.authResponse.accessToken;
} else {
// user clicked Cancel
}
});
}
Additional: Here is the code that handles the response (ASP.NET MVC, C#):
using Newtonsoft.Json.Linq;
[RequireHttps]
public ActionResult login(string token)
{
WebClient client = new WebClient();
string JsonResult = client.DownloadString(string.Concat(
"https://graph.facebook.com/me?access_token=", token));
JObject jsonUserInfo = JObject.Parse(JsonResult);
string nombre = jsonUserInfo.Value<string>("first_name");
string segundo_apellido = jsonUserInfo.Value<string>("last_name");
string nombre_completo = jsonUserInfo.Value<string>("name");
string genero = jsonUserInfo.Value<string>("gender");
string email = jsonUserInfo.Value<string>("email");
string birthday = jsonUserInfo.Value<string>("birthday");
// here you do your logic to login the user
// otherwise you can send user to the registration
// form and fill in some data you received from facebook
}

FB.getLoginStatus always returns null regardless if user is logged into FB

I'm trying to see if a user is logged into FB on my website. I have the following code below but regardless if I'm logged into my FB account or not the FB.getLoginStatus response is always returning null.
<script type="text/javascript">
window.fbAsyncInit = function() {
FB.init({appId: 'XXXXXXXXXXXXXXX', status: true, cookie: true,
xfbml: true});
FB.getLoginStatus(function(response) {
if (response.session) {
alert('Logged In');
} else {
alert('Not Logged In');
}
});
};
(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>
So it turns out this was a misinterpretation of the FB docs. The session will only return if the user is connected to the app. To see if the user is logged in but not connected you need to use response.status
maybe response.session is deprecated, official working example from Facebook:
To determine if a user is connected to your app:
FB.getLoginStatus(function(response) {
if (response.authResponse) {
// logged in and connected user, someone you know
} else {
// no user session available, someone you dont know
}
});

Facebook FB.ui stream.share error

My FB.ui stream.share and stream.publish work perfectly but when I call the Callback funcion, it always returns as error, even though the story is published on my Facebook profile.
[script] <div id="fb-root<?php the_ID();?>"></div>
<script>
window.fbAsyncInit = function() {
FB.init({appId: '151136734905815', status: true, cookie: true, xfbml: true});
};
(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<?php the_ID();?>').appendChild(e);
}());
function fb_share (url, title){
var share = {
method: 'stream.share',
display: 'dialog',
u: url,
t: title
};
FB.ui(share, function(response) {
if (response && response.post_id) {
alert(response.post_id);
} else {
alert('Error: Post was not published due to some error. Please try again later.');
}
});
}
</script>[/script]
It always returns Error: Post was not published due to some error. Please try again later. even though the story is in facebook successfully. Any help on this?
$('#share').bind('click', function(e){
var share = {
method: 'stream.share',
u: 'http://your/share/url/with/id/123'
};
FB.ui(share, function(){
$.post("/log_shares.php", {"id": 123});
});
e.preventDefault();
});