Facebook Plugin not working in ionic 1

256 views Asked by At

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>&nbsp;
  Sign in using facebook
  </a>
1

There are 1 answers

0
Manoj Bhardwaj On

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"

        $rootScope.loginFacebook = function() {
           $cordovaFacebook.login(["public_profile", "email", "user_birthday", "user_photos"]).then(function(success){
            console.info(success.status);

            if (success.status === 'connected') {
                var checkrequest = {
                    'AuthSession[device_token]': $localStorage.device_token
                }
                appname.check(checkrequest).then(function(response) {
                    console.log(response);
                    if (response.key == "NOAUTH") {
                        $state.go('main.allowPush')
                    }
                })
            } else if (success.status === 'not_authorized') {
                console.info('the user is logged in to Facebook but has not 
                      authenticated your app')
            } else {
                console.info('the user is nott logged in to Facebook')
            }

        }, function(error) {
            console.info(error);
        });


    }