We Keep Coding

Parse Facebook Login Error: "You must initialize FacebookUtils before calling logIn"

I am trying to use Facebook login on Parse with cordova.
$cordovaFacebook.login(['email'], function(response) {
Parse.FacebookUtils.logIn('email', {
success: function(user) {
console.log('success fb login')
// Handle successful login
},
error: function(user, error) {
// Handle errors and cancellation
console.error(error)
}
});
}, function(error) {
console.error(error)
});
And in a .run block on app.js, I have
window.fbAsyncInit = function () {
Parse.FacebookUtils.init({
appId: fbAppId,
autoLogAppEvents: true,
xfbml: true,
status: true,
cookie: true,
version: 'v2.4'
});
FB.AppEvents.logPageView();
console.log('Parse FB loaded')
// loadParse()
};
However, on the logger when I run the app on my iOS device, I never see a "Parse FB loaded". When I run it on a browser, I do see the "Parse FB Loaded".
Whenever I try to login via Facebook on my device, I get the error You must initialize FacebookUtils before calling logIn.
I believe the issue is that Parse is not initing FacebookUtils when on a device, but it is on the browser. Why would this be? Would it be an issue with the window object?
Note that the Facebook login itself is working (through the whole FB login flow), but after the callback to login via Parse with FacebookUtils, I receive the described error.
Thanks for your help!

try this... before to FacebookUtils
parse.initialize('APPLICATION_ID', 'JAVASCRIPT_KEY');
parse.serverURL = 'https://parseapi.back4app.com/';
parse.FacebookUtils.init({ // this line replaces FB.init({
appId : 'xxxxxxx', // Facebook App ID
status : true, // check Facebook Login status
cookie : true, // enable cookies to allow Parse to access the session
xfbml : true, // initialize Facebook social plugins on the page
version : 'v2.12'//point to the latest Facebook Graph API version
});

Do I need an App ID to query the feed of a public profile on Facebook?

We are trying to build a custom list of recent posts on a customer's Facebook page using the Javascript library of the Graph API. Doing something like http://graph.facebook.com/idea.int.SoD/picture works fine, but I understand that I need to authenticate for http://graph.facebook.com/idea.int.SoD?fields=posts.limit(5) amongst others.
I have registered a new App on the Facebook admin interface, and am trying to init and login with Javascript like this:
window.fbAsyncInit = function () {
FB.init({
appId: '...',
xfbml: true, // if true parse your page's DOM to find and initialize any social plugins that have been added using XFBML
status: true, // the SDK will attempt to get info about the current user immediately after init
version: 'v2.1'
});
FB.login(
function (response) {
console.log("Response form FB.login", response);
},
{
// scope: 'publish_actions' // get permission in order to make publishing API calls
scope: 'manage_pages' // manipulate a FB page (not a user)
}
);
FB.api(
"/idea.int.SoD?fields=posts.limit(5)",
function (response) {
...
But I get "type": "OAuthException", "code": 104 as a response.
My question is:
How do we get this AppID authorized by the customer's profile so that it can make these calls. Do I need to go through the whole app publishing process just to create a custom widget on their website?
And can this work independently of the user visiting the site? i.e. that it's the App looking up this data from the feed, rather than the visitor logging in and doing the API request.

publish_actions in scope not triggering second dialog

I have the following javascript code to login to my website using facebook
FB.login(function(response) {
if (response.authResponse) {
var uid = response.authResponse.userID;
var accessToken = response.authResponse.accessToken;
//proceed to login
} else {
//login failed
}
}, {scope: 'publish_actions, email, user_birthday',
appId : 'myAppId',
cookie : true});
The first dialog shows up fine requesting their email and birthday. However, the second (optional) dialog does not show up requesting to post to their profile. I have seen this on many sites, but it does not show up on mine.
Is there any other steps I need to take to show this? I have tried publish_stream as well.
EDIT: Still no answer. I am testing with a Facebook account that was previously connected, but I removed the app from my Facebook profile and connected again. That should ensure that the second dialog comes up, but it doesn't.

I once read in the facebook documentation you must request this permission in the init function.
try
window.fbAsyncInit = function () {
FB.init({
appId: 'Id_App',
status: true,
xfbml: true
}), { scope: 'publish_actions' };
};

Facebook js sdk can't retrieve name of logged user

I am using the facebook JS SDK. I am currently logged in facebook and my code is the folowing :
$(document).ready(function() {
FB.init({
appId: "myappID",
xfbml: true
});
FB.api('/me', function(response) {
alert(response.name);
});
});
The alert I'm getting says "undefined". Why ? Is there a way to get the Facebook unique app-id ?
Thank you very much

The alert I'm getting says "undefined". Why ?
Most likely because your user account hasen’t connected to your app yet.
Call FB.login first, and put the API call into the callback handler.

Because you haven't authorized your app yet.
Use FB.login to login to your app first.

I found weird that you are initializing the FB JS SDK inside a jQuery's $(document).ready.
Are you doing sync-loading? If you are following the Facebook's instructions you are actually doing a async-loading, which is better, because does not block the page loading. In a async-load, the <script> tag that contains all.js (the Facebook's JS SDK) is attached to document DOM after the $(document).ready event triggers.
So, you are trying to access a js-object (FB) that is not defined yet. It is better to assign your code to the window.fbAsyncInit, as instructed in Facebook's documentation:
window.fbAsyncInit = function() {
FB.init({
appId: 'AppID',
cookie: true, // I think you'll need this cookie to make the API call
xfbml: true
});
// Additional initialization code here
FB.api('/me', function(response) {
alert(response.name);
});
};
Good luck!

How to detect user logging out of Facebook after logging into my app?

My application uses Facebook authentication:
FB.init({
appId: config.fbAppId,
status: true,
cookie: true,
// xfbml: true,
// channelURL : 'http://WWW.MYDOMAIN.COM/channel.html', // TODO
oauth : true
});
// later...
FB.login(function(response)
{
console.log(response);
console.log("authId: " + response.authResponse.userID);
gameSwf.setLoginFacebook(response.authResponse.accessToken);
}, {scope:'email,publish_actions,read_friendlists'});
And when using it, people can post to their wall:
var obj = {
method: 'feed',
link: linkUrl,
picture: pictureUrl,
name: title,
caption: "",
description: message
};
function callback(response) {
// console.log("Post on wall: " + response);
}
FB.ui(obj, callback);
This works fine, but there is one little hickup. If people:
Log in on the app.
Log out of Facebook.
Attempt to make a wall post from the app.
The opening of the wall post dialog fails. The console says "Refused to display document because display forbidden by X-Frame-Options.".
Can I instead get Facebook to show a login prompt to the user. Or can I detect the error and tell the user that he's no longer logged in on Facebook?

Just recall getLoginStatus BUT forcing a roundtrip to Facebook. Look following code:
FB.getLoginStatus(function(response) {
// some code
}, true);
Look the last parameter set to true to force the roundtrip.
From JS SDK documentation:
To improve the performance of your application, not every call to
check the status of the user will result in request to Facebook's
servers. Where possible, the response is cached. The first time in the
current browser session that FB.getLoginStatus is called, or the JS
SDK is init'd with status: true, the response object will be cached by
the SDK. Subsequent calls to FB.getLoginStatus will return data from
this cached response.
This can cause problems where the user has logged into (or out of)
Facebook since the last full session lookup, or if the user has
removed your application in their account settings.
To get around this, you call FB.getLoginStatus with the second
parameter set to true to force a roundtrip to Facebook - effectively
refreshing the cache of the response object.
(http://developers.facebook.com/docs/reference/javascript/FB.getLoginStatus/)

What you could try and use is the FB.getLoginStatus where if the user is connected this would allow them to complete the wall post.
If they aren't connected then call the FB.login method before they can post on the wall.
FB.getLoginStatus(function(response) {
if (response.status === 'connected') {
// the user is logged in and has authenticated your
// app, and response.authResponse supplies
// the user's ID, a valid access token, a signed
// request, and the time the access token
// and signed request each expire
var uid = response.authResponse.userID;
var accessToken = response.authResponse.accessToken;
} else if (response.status === 'not_authorized') {
// the user is logged in to Facebook,
// but has not authenticated your app
} else {
// the user isn't logged in to Facebook.
}
});
http://developers.facebook.com/docs/reference/javascript/FB.getLoginStatus/
There are also the events for login and logout that you can watch for and do something with those responses.
FB.Event.subscribe('auth.login', function(response) {
// do something with response
});
FB.Event.subscribe('auth.logout', function(response) {
// do something with response
});
http://developers.facebook.com/docs/reference/javascript/FB.Event.subscribe/