How to login with Google OAuth2 using Angularjs inside Phonegap using ClientID and ClientSecret

前端 未结 1 1583
庸人自扰
庸人自扰 2021-02-09 08:27

I am trying to login from my Phonegap App using Angularjs (using the Ionic Framework) through Google OAuth2. Currently I am using the http://phonegap-tips.com/articles/google-ap

相关标签:
1条回答
  • 2021-02-09 08:57

    I did the solution like this, where TestCtrl is the Controller where the Login Button resides. There is a mix of jquery based $.ajax calls, which I am going to change to the angualar way. The google_call function basically calls the google_api which is mentioned in the link mentioned above in phonegap-tips.

    .controller('TestCtrl', function($scope,$ionicPopup) {
    $scope.logged_in = false;
    $scope.getMember = function(id) {
        console.log(id);
    };
    $scope.test = function(){
        $ionicPopup.alert({"title":"Clicked"});
    }
    
    $scope.call_google = function(){
        googleapi.authorize({
        client_id: 'CLIENT_ID',
        client_secret: 'CLIENT_SECRET',
    
        redirect_uri: 'http://localhost',
        scope: 'https://www.googleapis.com/auth/plus.login https://www.googleapis.com/auth/userinfo.email'
        }).done(function(data) {
            accessToken=data.access_token;
            // alert(accessToken);
            // $loginStatus.html('Access Token: ' + data.access_token);
            console.log(data.access_token);
            //$ionicPopup.alert({"title":JSON.stringify(data)});
            $scope.getDataProfile();
        });
    };
    $scope.getDataProfile = function(){
        var term=null;
        //  alert("getting user data="+accessToken);
        $.ajax({
               url:'https://www.googleapis.com/oauth2/v1/userinfo?alt=json&access_token='+accessToken,
               type:'GET',
               data:term,
               dataType:'json',
               error:function(jqXHR,text_status,strError){
               },
               success:function(data)
               {
               var item;
    
               console.log(JSON.stringify(data));
               // Save the userprofile data in your localStorage.
               window.localStorage.gmailLogin="true";
               window.localStorage.gmailID=data.id;
               window.localStorage.gmailEmail=data.email;
               window.localStorage.gmailFirstName=data.given_name;
               window.localStorage.gmailLastName=data.family_name;
               window.localStorage.gmailProfilePicture=data.picture;
               window.localStorage.gmailGender=data.gender;
               window.localStorage.gmailName=data.name;
               $scope.email = data.email;
               $scope.name = data.name;
               }
            });
            //$scope.disconnectUser(); //This call can be done later.
    };
    $scope.disconnectUser = function() {
      var revokeUrl = 'https://accounts.google.com/o/oauth2/revoke?token='+accessToken;
    
      // Perform an asynchronous GET request.
      $.ajax({
        type: 'GET',
        url: revokeUrl,
        async: false,
        contentType: "application/json",
        dataType: 'jsonp',
        success: function(nullResponse) {
          // Do something now that user is disconnected
          // The response is always undefined.
          accessToken=null;
          console.log(JSON.stringify(nullResponse));
          console.log("-----signed out..!!----"+accessToken);
        },
        error: function(e) {
          // Handle the error
          // console.log(e);
          // You could point users to manually disconnect if unsuccessful
          // https://plus.google.com/apps
        }
      });
    };
    })
    

    I am providing this answer for the newbies who faced similar problems like mine while trying to login using Google OAuth2. So asking for Upvotes shamelessly as I am new here too!

    0 讨论(0)
提交回复
热议问题