I am developing an app from ionic-1. I also implemented facebook login plugin. I've followed this steps. I have no errors, but when I click on the facebook button, it doesn't work, no errors displaying. I use alert
in every error catch but no alert will be displayed.
NOTE: I am running in an real android device because they said that native plugin will not work in browser.
Please help me because Im working with my thesis. Thanks to all of you!
Here's my code:
.controller('CreateAccountCtrl', ['$scope','$http','$state','$q','UserService','$stateParams', '$ionicLoading','$timeout','$ionicPopup',function($scope, $http,$state,$q, UserService,$stateParams,$ionicLoading,$timeout,$ionicPopup){
$scope.$on('$ionicView.beforeEnter', function(e){
$ionicLoading.show({
animation: 'fade-in', showBackdrop: true
});
});
$scope.$on('$ionicView.afterEnter', function(e){
$ionicLoading.hide();
$scope.formData = {};
$scope.showAlert = function(ttl,msg){
var alertPopup = $ionicPopup.alert({
title: ttl,
template: msg
});
};
});
// facebook
// This is the success callbak from the login method
var fbLoginSuccess = function(response){
if(!response.authResponse){
fbLoginError("Cannot find the authResponse");
return;
}
var authResponse = response.authResponse;
getFacebookProfileInfo(authResponse)
.then(function(profileInfo){
// store user data on local storage
UserService.setUser({
authResponse: authResponse,
userID: profileInfo.id,
name: profileInfo.name,
email: profileInfo.email,
picture: "http://graph.facebook.com/" + authResponse.userID + "/picture?type=large"
});
$ionicLoading.hide();
$state.go('app.home');
}, function(fail){
alert(fail);
// Fail get profile info
console.log('Profile Info Fail', fail);
});
};
// This is the fail callback from the login method
var fbLoginError = function(error){
console.log('fbLoginError', error);
alert(error);
$ionicLoading.hide();
};
// This method is to get the user profile info from the facebook api
var getFacebookProfileInfo = function(authResponse){
var info = $q.defer();
facebookConnectPlugin.api('/me?fields=email,name&access_token=' + authResponse.accessToken, null,
function(response){
alert(response);
console.log(response);
info.resolve(response);
},
function(response){
console.log(response);
alert(response);
info.reject(response);
}
);
return info.promise;
};
// This method is executed when the user press the "Login with faceboook" button
$scope.facebookSignIn = function(){
alert(1);
facebookConnectPlugin.getLoginStatus(function(success){
if(success.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
console.log('getLoginStatus', success.status);
alert(success.status);
// Check if we have our user saved
var user = UserService.getUser('facebook');
if(!user.userID){
getFacebookProfileInfo(success.authResponse)
.then(function(profileInfo){
UserService.setUser({
authResponse: success.authResponse,
userID: profileInfo.id,
name: profileInfo.name,
email: profileInfo.email,
picture : "http://graph.facebook.com/" + success.authResponse.userID + "/picture?type=large"
});
$state.go('app.home');
}, function(fail){
console.log('Profile info fail', fail);
alert(fail);
});
}else{
$state.go('app.home');
}
}else{
// If (success.status === 'not_authorized') the user is logged in to Facebook,
// but has not authenticated your app
// Else the person is not logged into Facebook,
// so we're not sure if they are logged into this app or not.
console.log('getLoginStatus', success.status);
alert(success.status);
$ionicLoading.show({
template: 'Logging in...'
});
facebookConnectPlugin.login(['email','public_profile'], fbLoginSuccess, fbLoginError);
}
});
};
}]);
And in my html
<a class="facebook-sign-in button button-block button-facebook" ng-click="facebookSignIn()">
<i class="icon ion-social-facebook"></i>
Sign in using facebook
</a>
APP_NAME="must be facebook application name that's created on facebook developer not your app name" APP_ID=facebook app id.
Install with facebook v4 $ cordova plugin add cordova-plugin-facebook4 --save --variable APP_ID="123456789" --variable APP_NAME="myApplication"