CODEWITHSUNDEEP
angularjsresources
Sabourinov
Sabourinov

Reputation: 297

Angularjs resource handling response & custom methods

Is it possible within the AuthService to handle the response and set the session with the SessionService?

I doing it in the controller right now with the success callback but I'm still new to Angularjs and trying to understand how to customize a resource.

I'm using Angularjs 1.1.5

app.factory('AuthService', ['$resource', 'SessionService',
function($resource, SessionService) {

    return $resource(
        '/api/v1/auth/:action',
        {action:'@action'},
        {
            login: {
                method:'POST',
                params: {
                    action: 'login'
                }
            },
            logout: {
                method:'GET',
                params: {
                    action: 'logout'
                }
            }
        }
    );
}
]);

app.controller('LoginCtrl', ['$scope', '$location', 'AuthService', 'SessionService' function LoginCtrl($scope, $location, AuthService, SessionService) {

$scope.credentials = { email: "", password: ""};

$scope.login = function() {
    AuthService.login($scope.credentials).success(function() {
        SessionService.set('authenticated', true);
        $location.path('/home');
    });
}
}]);

app.factory("SessionService", function() {
 return {
  get: function(key) {
   return sessionStorage.getItem(key);
  },
  set: function(key, val) {
   return sessionStorage.setItem(key, val);
  },
  unset: function(key) {
   return sessionStorage.removeItem(key);
  }
 }
});

Upvotes: 1

Views: 1858

Answers (2)

Daniel Tabuenca
Daniel Tabuenca

Reputation: 13661

I'm not sure that $resource is the appropriate abstraction to use here. I think it would be much simpler to implement your AuthService using plain $http. Just implement login and logout as normal function, then you can feel free to do whatever you want there. You should also make sure you return the promise, that way whoever calls login() or logout() can still do .then() on it if they need to do additional things after login. Here's an example:

app.factory('AuthService', ['$http', '$location' 'SessionService',
function($http, $location, SessionService) {
     var baseUrl = '/api/v1/auth/';

     function onLoginSuccess(data){
            SessionService.set('authenticated', true);
            $location.path('/home');
     }

     function onLoginFailure(error){
       SessionService.unset('authenticated');
       $location.path('/login');
     }


    return {
      login: function(credentials){
          return $http.post(baseUrl+'login', credential).then(onLoginSuccess, onLoginFailure);
      }

      logout: function(){
          return $http.get(baseUrl+'logout');
      }
    };

app.controller('LoginCtrl', ['$scope', 'AuthService', function LoginCtrl($scope, AuthService) {
    $scope.credentials = { email: "", password: ""};
    $scope.login = function() {
        AuthService.login($scope.credentials);      
    }
}]);

app.factory("SessionService", function() {
 return {
  get: function(key) {
   return sessionStorage.getItem(key);
  },
  set: function(key, val) {
   return sessionStorage.setItem(key, val);
  },
  unset: function(key) {
   return sessionStorage.removeItem(key);
  }
 }
});

Upvotes: 1

Kobkrit Viriyayudhakorn
Kobkrit Viriyayudhakorn

Reputation: 481

Your server side script on path /api/v1/auth/login should return a result to indicate that the login is successfully granted or not.

For example, If the log in is granted, then /api/v1/auth/login returns the success response 200. If the login is denied, then /api/v1/auth/login returns the bad request response (failure) 400.

If with this condition, your code should be written as followed,

app.controller('LoginCtrl', ['$scope', '$location', 'AuthService', 'SessionService'
function LoginCtrl($scope, $location, AuthService, SessionService) {
    $scope.credentials = { email: "", password: ""};
    $scope.login = function() {
    AuthService.login($scope.credentials, function(data) { //Success callback
        SessionService.set('authenticated', true);
        $location.path('/home');
    }, function(error){ //Failure callback
        SessionService.unset('authenticated');
        $location.path('/login');
    });
}
}]);

Upvotes: 0

Related Questions