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!
Related
I have a Facebook login button:
<fb:login-button scope="email,user_birthday">Login with Facebook</fb:login-button>
and this JS:
window.fbAsyncInit = function() {
FB.init({
appId: 'APP_ID_HERE',
cookie: true,
xfbml: true,
oauth: true
});
FB.Event.subscribe('auth.login', function(response) {
window.location.reload();
});
};
My issue is that any page that contains this code always reloads once. It's because the login callback above is called (if the user is logged in to a Facebook account) even if the user has not yet clicked on the Login button above. Is this normal behavior? If not, how do I prevent the login callback from being called?
This event fires each time the SDK detects that the state changes from unknown/not_connected to connected.
It sounds like you want to actually provide a callback handler on the login button via onlogin
One solution: You could use the PHP sdk to check for the user status, and only if the user is NOT logged in, create the JavaScript part where you subscribe to auth.login.
I am using phonegap facebook plugin and facebook javascript api. here is my code
FB.init({
appId: "xxxxxxxxxxxxxxx",
status: true,
oauth :true,
nativeInterface: CDV.FB,
//channelURL : 'www', // Channel File
cookie: true,
//useCachedDialogs: false,
xfbml: true
});
FB.login(function(response) {
if (response.authResponse) {
alert(response.authResponse.userID); // literally shows three dots
FB.api('/me', function(me){
if (me.id) {
alert(me.id); // this works
}
});
}
}, { scope: "email" });
I can get accessToken from authResponse.... its a long string. but the userID field is literally "...". I can get the user's ID by making an extra round-trip to the server with another graph API call to fetch /me but that seems wasteful.
[For the benefit of the OP] You can get the userID in the client by making an extra call to the server as you started to show. Here's the correct code:
FB.api('/me', function(me){
if (me.id) {
var facebook_userid = me.id;
alert(facebook_userid);
}
});
This doesn't explain why the userID field is "..." in the login response object. But it is a workaround.
I posted a bug on github ( https://github.com/davejohnson/phonegap-plugin-facebook-connect/issues/151 ) because this seems a "feature" of the plugin. Not sure if the problem is in the facebook IOS sdk (not passing those data back from FB) or in the plugin (not passing those data back at JS level).
I am new to Facebook Javascript SDK. I am trying to create an application using this API. But has hard luck while usign the FB.api method. Somehow my FB.api method is not working properly each time. Sometimes it will give the response (I am just accessing response.name) while other time it will not invoked properly.
window.fbAsyncInit = function() {
FB.init({
appId : 'my_app_id', // App ID
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
oauth : true, // enable OAuth 2.0
xfbml : true // parse XFBML
});
FB.getLoginStatus(function(response) {
if (response.authResponse) {
alert('user is:'+response.status);
userId = response.authResponse.userID;
FB.api('/me',function(response) {
alert('Inside FB.api function');
document.getElementById("userInfo").innerHTML = 'Welcome <img src="https://graph.facebook.com/'+ response.id + '/picture" style="margin-right:5px"/>' +response.name + '!';
});
}
});
};
Other methods FB.ui and FB.getLoginStatus and Facebook like button is working as expected, but only FB.api is not working seamless manner as others. Do not why? Please help me to idenify the problem.
I had the exact same problem. This answer pointed me into the right direction:
FB.api does not work when called right after FB.init
To solve my problem I had to subscribe to the correct event. In my case it was 'auth.authResponseChange' after FB.init
FB.Event.subscribe('auth.authResponseChange', function(){
FB.api('/me',function(r){
console.log(r.id);
if (!r || r.error) {
alert('Error occured');
} else {
alert(r.name);
}
});
});
That code works fine for me, but you might want to try renaming your response variables. Inside the FB.api callback, you actually have two response variables which will undoubtedly cause problems. Try changing them and see if you get different results.
FB.getLoginStatus(function(loginResponse) {
if (loginResponse.authResponse) {
alert('user is:'+loginResponse.status);
userId = loginResponse.authResponse.userID;
FB.api('/me',function(apiResponse) {
alert('Inside FB.api function');
document.getElementById("userInfo").innerHTML = 'Welcome <img src="https://graph.facebook.com/'+ apiResponse.id + '/picture" style="margin-right:5px"/>' +apiResponse.name + '!';
});
}
});
Its possible there is something else on your page affecting this. Do you have a link to your page?
I had the same problem. FB.api just stopped working silently at some point in my app. I noticed it was due to a DOM manipulation of :
<div id="fb-root"></div>
Either a duplication or anything. You should check that point. It looks like Johan Strydom's problem.
My app allows users to send requests using Facebook Requests Dialogue.
I run the init as follow:
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
FB.init({
appId: '193078857407882',
status: true,
cookie: true,
xfbml: false,
});
</script>
From what I understand in the documentation the 'status: true' is supposed to check if the user is logged in to facebook.
However in my app when the user is not logged in it just shows the following error message:
An error occurred with hbg. Please try again later.
How can I force the application to check if the user is logged in and if not to log in?
Rails 3.0.7, Ruby 1.9.2, Js SDK
According to the Facebook docs for FB.getLoginStatus, if you want to receive the response from passing status: true to FB.init, then you need to subscribe to the auth.statusChange event:
While you can call FB.getLoginStatus any time (for example, when the
user tries to take a social action), most social apps need to know the
user's status as soon as possible after the page loads. In this case,
rather than calling FB.getLoginStatus explicitly, its possible to
check the user's status by setting the status: true parameter with you
call FB.init.
To receive the response of this call, you must subscribe to the
auth.statusChange event. The response object passed by this event is
identical to that which would be returned by calling FB.getLoginStatus
explicitly.
So in your code you would do something like
FB.Event.subscribe('auth.authResponseChange', function(response) {
alert('The status of the session is: ' + response.status);
});
Except you would subscribe to auth.statusChange instead. Note, however, that according to the FB.Event.subscribe docs:
auth.statusChange() does not have a 'status' field.
You can check login status by calling FB.getLoginStatus
FB.getLoginStatus(function(response) {
if (response.authResponse) {
// logged in and connected user
} else {
FB.login(function(res) {
if (res.authResponse) {
// user logged in
} else {
// user cancelled login
}
});
}
});
I have the following code to allow users to invite thier Facebook friends:
function create_fb_friends() {
FB.init({
appId : 'xxxxxxx',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
FB.ui({
method: 'fbml.dialog',
fbml: (
'<fb:request-form action="/" target="_top"\
method="POST"\
invite="true"\
type="MyApp Application"\
content="Checkout this new application.">\
<fb:multi-friend-selector\
showborder="false"\
actiontext="Invite friends to...">\
</fb:request-form>'
),
size: {width:640,height:480}, width:640, height:480
});
}
When I click on send invitation, I get only an error from Facebook:
Sorry, your request could not be processed.
Please try again
I do not have any clue where the problem could be, since there is not a real feedback in the error.
It seems as though this is a known problem: http://bugs.developers.facebook.net/show_bug.cgi?id=10874
Unfortunately it has been open for ages with no real feedback / action.
Side note - that error seems to point to a problem with the 'action' parameter. I replaced the URL's I was using with URL's shortened by bit.ly and it seems to be working.
Another thing the fb:multi-friend-selector is on its way out now and will no longer be available as mentioned here.
https://developers.facebook.com/docs/reference/fbml/multi-friend-selector/
Just using the example on this page would do.
https://developers.facebook.com/docs/reference/dialogs/requests/