I'm trying to use the FB api for login on an app built with angularjs. I'm using the angular-facebook library. It works, but the issue is that once the user authorized the app, the callback is not called. So the popup window is not closed, and the only solution for the user is to reload the page. How can I fix this?
$scope.login = function() {
Facebook.login(function(response) {
// this is never called ;_;
if (response.status == 'connected') {
// I need to do stuff here
}
}, {scope: 'email,user_birthday,user_likes'});
};
IF you want more detail information on how to use AngularJS with FacebookAPI, this might be helpful:
http://www.boynux.com/angularjs-facebook-integration/
Regards,
Based on the angular-facebook documentation shouldn't your code look like this?
$scope.login = function() {
Facebook.login(function(response) {
// Do something with response. Don't forget here you are on Facebook scope so use $scope.$apply
});
};
With the Facebook.login function wrapped within a $scope.login function?
Related
Documentation for Parse.FacebookUtils.init() states:
The status flag will be coerced to 'false' because it interferes with Parse Facebook integration. Call FB.getLoginStatus() explicitly if this behavior is required by your application.
Unfortunately, when I try to call FB.getLoginStatus(), I get TypeError: Cannot read property 'getLoginStatus' of undefined. Is there either a callback that I can use to know when FB is loaded, or some other way to check the login status of a user on page load?
It would help to see some code, it sounds like the SDK hasn't loaded when you call getLoginStatus().
Anyway this may help, I took Facebook's basic Login flow and added Parse around it. It checks when the DOM is loaded so you could use some of this logic also.
Simple Facebook Login test with Parse - view source
Hope this helps.
I ended up using promises to resolve FB after it's loaded.
var fbDeferred = $q.defer();
$window.fbAsyncInit = function() {
Parse.FacebookUtils.init({
appId : 'xxxxxx',
xfbml : true,
version : 'v2.2'
});
fbDeferred.resolve(FB);
};
var getFB = function(){
return fbDeferred.promise;
}
var getFBLoginStatus = function(){
return getFB().then(function(FB){
//**FB is now available**
FB.getLoginStatus(function(response) {
if (response.status !== 'connected'){
...
}else{
...
}
});
});
});
I'm using Facebook JS SDK to develop a Facebook Page Tab application. There is a button in landing page. When clicked, user will be asked to install the App if they haven't done so.
The codes are as follow:
<script type="text/javascript">
function installApp() {
FB.login(function(response) {
if (response.authResponse) {
var accessToken = response.authResponse.accessToken;
}
if (response.status === 'connected') {
window.location = 'share.php';
} else {
alert('Please install app first');
}
}, {scope:'friends_likes,email'});
}
</script>
By default FB.Login will result in a popup box asking for permission. Is there any alternative way to AVOID the popup box? I have seen other Facebook apps successfully achieve this, but I have no idea how they did it.
You can use the Javascript Api with a Graph Api call for this,
function fbLogin() {
var oauth_url = 'https://www.facebook.com/dialog/oauth/';
oauth_url += '?client_id=APP_ID_HERE';
oauth_url += '&redirect_uri=' + encodeURIComponent('https://apps.facebook.com/APP_NAMESPACE/');
oauth_url += '&scope=email'
window.top.location = oauth_url;
}
then you can call it in a custom button with the onclick event:
Custom Login
Have you went through the Authentication documentation?
It pretty much cover all of the options that are available to you. i.e.:
Client-Side Authentication
Server-Side Authentication
Authentication within a Page Tab
You can probably use any of those approaches, but the 3rd probably will fit best.
I have a facebook application. The users are logged in and authorized. I am calling fb.api to post the user's name to my textfile. The alert shows the name. The post doesn't seem to post to my aspx file..
FB.Event.subscribe('edge.remove', function (href, widget) {
alert("outside");
FB.api('/me', function (response) {
alert(response.name);
var paramsObj = { 'name': response.name };
$.post("ajax/delete.aspx", paramsObj);
});
window.location.replace("Default.aspx");
});
I've updated my code to include showing the encapsulating facebook calls to give a broader picture as well as to include #Lix changes [thank you!].
Few things you might want to try :
Define your post parameters object before and only place the objects name in the jQuery $.post method.
Wrap your json keynames with quotes.
var paramsObj = { 'name':response.name};
$.post("ajax/write.aspx", paramsObj );
Use firebug/chrome developers tools to debug the AJAX request and see if any value is being passed and/or use breakpoints in your code to help you understand where the value is missing.
The page was being redirected prior to the api call/ajax post. This is what worked:
FB.Event.subscribe('edge.remove', function (href, widget) {
FB.api('/me', function (response) {
var paramsObj = { 'name': response.name };
$.post("ajax/delete.aspx", paramsObj);
window.location.replace("Default.aspx");
});
});
Via the Facebook javascript API, you can subscribe to the 'event.create' event to listen for when users "Like" something on a page via the Like Plugin. Is it possible to respond to the same user un-liking it as well? I don't see any events documented, wondering if this is a hidden feature.
You can now subscribe to the “edge.remove" event to know when a user unlikes a page. For example:
FB.Event.subscribe('edge.remove', function(href, widget) {
alert('You just unliked '+href);
});
Announcement: http://developers.facebook.com/blog/post/446/ documented at http://developers.facebook.com/docs/reference/javascript/FB.Event.subscribe
Recently added:
http://bugs.developers.facebook.net/show_bug.cgi?id=10796
The javascript sdk does not have an event for this. I have run into this problem before. The only way to check if a user has unliked an item is to do a Graph or Rest query to determine if they currently like the item.
Unfortunately "edge.remove" won't get triggered when you dislike a facebook-page via "liked"-button (on the top right) and click on "unlike". -.-
This event is very useful to create a vote system. The js-script below does an ajax-call to a PHP-page that updates a database.
var _paq = _paq || [];
FB.Event.subscribe('edge.create', function(response) {
var page = $("#pageid").val();
$.post("ajax_vote.php", { page: page },
function(data) {
//alert("voted : " + data);
});
});
FB.Event.subscribe('edge.remove', function(response) {
var page = $("#pageid").val();
$.post("ajax_unvote.php", { page: page },
function(data) {
//alert("unvoted : " + data);
});
});
I'm working in a mini-app, which will have 3 pages, and i want all the interaction to happen inside a profile-tab.So, using javascript, i want to show/hide a few divs, which i'll populate using the FBJS ajax object.
My problem is, i'm not getting the user session in the ajax calls.As documentation is extremely confusing, i've ended up not knowing if this is possible at all.Any ideas?
You can get the user's id if you require login from your ajax request on a profile tab. For instance:
var ajax = new Ajax();
ajax.responseType = Ajax.RAW;
ajax.ondone = function(data) {
console.log('done');
console.log(data);
}
ajax.onerror = function(data) {
console.log('error');
console.log(data);
}
ajax.requireLogin = true;
ajax.post('http://DOMAIN/add_story', {story: story});
The requireLogin = true part will cause an authorization window to popup. If they agree, you can get the user ID in your AJAX handler using the PHP SDK, like:
$facebook->getUser();