I am working on an Angular app which calls an external API for login authentication.
I am to successfully call the API for logging in and logging out, which I use to put in a boolean into Local Storage (so it persists on refresh).
I feel this might be a pretty terrible way of implementing this. Is there a better way in Angular to do this?
My implementation:
app.js
var module = angular
.module('myApp', [
'ngRoute',
'ngTouch',
'LocalStorageModule'
])
.config(function ($routeProvider, $locationProvider, localStorageServiceProvider) {
$routeProvider
...
.when('/protectedroute, {
...
resolve: {
'auth': function(Auth) {
return Auth.authorized();
}
}
})
}
Auth service:
angular.module('myApp')
.service('Auth', function ($http, $q, $window, $location, localStorageService) {
var isLogged = localStorageService.get('isLogged');
console.log(isLogged);
return {
authorized: function() {
if (!localStorageService.get('isLogged')) {
console.log('DENY');
$location.path('/');
} else {
console.log('ALLOW');
}
}
}
});
login service:
angular.module('myApp')
.service('Login', function ($http, $q, $window, $location, localStorageService) {
return {
login: function (username, password) {
var reqLogin = {
method: 'POST',
url: 'url_api',
data: $.param({
'user[email]': username,
'user[password]': password
}),
headers: {
...
}
}
$http(reqLogin).then(function successCallback(response) {
console.log('success!');
console.log(response);
localStorageService.set('isLogged', true);
localStorageService.set('user[email]', username);
console.log(localStorageService.get('isLogged'), localStorageService.get('user[email]'));
$location.path('/profile');
}, function errorCallback(response) {
console.log('failure');
console.log(response);
});
},
logout: function() {
var reqLogout = {
method: 'DELETE',
url: 'url_api',
headers: {
...
}
}
$http(reqLogout).then(function successCallback(response) {
console.log('success!');
console.log(response);
localStorageService.set('isLogged', false);
console.log(localStorageService.get('isLogged'), localStorageService.get('user[email]'));
$location.path('/');
}, function errorCallback(response) {
console.log('failure');
console.log(response);
});
}
};
});