I currently have a Facebook canvas app located at
Previously, I was using an anchor link to direct users to the OAUTH login flow.
After implementing the Facebook JavaScript SDK, I followed this logic:
1) Initialization of the FB API
FB.init({
appId: 'XXXXXXXXXXXXXX',
xfbml: true,
cookie: true,
oauth : true,
channelUrl: 'http://www.niteflymobile.com/insideny/channel.html' },
{scope: 'email'});
2) Checking for login status
FB.getLoginStatus(function(response) { ... } )
3) If the user is logged in (response.status == "connected"), set a proper cookie and redirect them to the logged-in page.
4) The issue arises here: if response.status != "connected" (usually returns "not_authorized" for new users), then initiate a call to FB.login(function(response) { ... }).
4a) The FB.login function results in 2 errors like the following:
"Unsafe JavaScript attempt to access frame with URL static.ak.fbcdn.net/connect/xd_proxy.php?version=3&error_reason=user_denied&error=access_denied&error_description=The+user+denied+your+request.#cb=f22684144&origin=http%3a%2F%2Fwww.niteflymobile.com%2Ff185641ad8&relation=opener&transport=postmessage&frame=f39056acd8 from frame with URL www.niteflymobile.com/insideny/#. Domains, protocols and ports must match."
(http:// removed from both links to comply with SO rules for new users)
In addition, the returned object that I wrote to the console contains a null authResponse and the status is "unknown" instead of "not_authorized."
The main problem here is that the authorization popup appears blank and quickly closes without any user interaction.
Any suggestions, assistance, or insights would be greatly appreciated, as I've been struggling with this for quite some time now, and I suspect it may be a simple mistake that I can't see because I'm too involved in it.
I recently disabled sandbox mode - could that have caused this issue?
FULL CODE BELOW:
$('.fb_link').click(function() {
FB.init({appId: 'XXXXXXXXXX', xfbml: true, cookie: true, oauth : true, channelUrl: 'http://www.niteflymobile.com/insideny/channel.html' },{scope: 'email'});
//setup fb login check
FB.getLoginStatus(function(response) {
if(response) {
console.log(response);
if(response.status == "connected") {
alert(response.status);
alert(response.authResponse.userID+"preajax");
//jquery cookie write
$.cookie('fbID', response.authResponse.userID, { expires: 29, path: '/' });
//secondary cookie write using only javascript
createCookie('fbID', response.authResponse.userID, 29);
//bandaid to fire ajax to set cookie on server side if the js side fails
var fbID_check = readCookie('fbID');
if(fbID_check) {
alert("fbID cookie set "+fbID_check);
window.location = "http://apps.facebook.com/insideny/";
}
else {
url_vars = "fbID="+response.authResponse.userID;
$.ajax({
type: "POST",
url: "set_fb_cookie.php",
data: url_vars,
success: function(data){
alert(data + "passed back from ajax");
var fbID_check_2 = readCookie("fbID");
alert(fbID_check_2 + "read from cookie");
window.location = "http://apps.facebook.com/insideny/";
}
});
return false;
}
alert(response.authResponse.userID+"postajax");
}
else {
FB.login(function(response) {
alert('here');
console.log(response);
});
}
}
})
})
UPDATE 8.12 @felipe-brahm
Tried the following code with the same effect (popup appears blank and closes down):
$('.fb_link').click(function() {
FB.init({appId: 'XXXXXXXXXXXXX', xfbml: true, cookie: true, oauth : true, channelUrl: 'niteflymobile.com/insideny/channel.html'; },{scope: 'email'});
FB.login(function(response) {
console.log(response); })
})