Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Redirect to route if user is not authenticated

I'm trying to cleanly implement a way to redirect the user to a login route if they're not logged in. I'm basing my solution off of another SO answer here that doesn't work out of the box. Here's my solution.

angular.module('myApp', ['ngResource', 'ngRoute'])
  .config(['$routeProvider', function ($routeProvider) {
    var requireAuthentication = function () {
        return {
            load: function ($q) {
                console.log('Can user access route?');
                if (g_isloggedIn === true) { // fire $routeChangeSuccess
                    var deferred = $q.defer();
                    deferred.resolve();
                    console.log('Yes they can!');
                    return deferred.promise;
                } else { // fire $routeChangeError
                    console.log('No they cant!');
                    return $q.reject("'/login'");
                }
            }
        };
    };

    $routeProvider
        .when('/some_page_that_requires_authentication', {
            templateUrl: '/views/secret.html',
            controller: 'secretCtrl',
            resolve: requireAuthentication()
        })
        .when('/anybody_can_see_me', {
            templateUrl: '/views/public.html',
            controller: 'publicCtrl',
        });
}]);

My question is, where can I listen on the $routeChangeError event so that I can redirect the route? I tried doing it in a directive, but could never get the event to fire. I can't put it into a controller, because it won't load if the promise is rejected. Any thoughts?

like image 740
w.brian Avatar asked Oct 20 '22 19:10

w.brian


1 Answers

Is there a reason why you shouldn't redirect the user from inside the function? This works fine for me, it doesn't load the controller / view if the promise is not resolved.

I modified the function like this:

var requireAuthentication = function () {
    return {
        load: function ($q, $location) {
            console.log('Can user access route?');
            var deferred = $q.defer();
            deferred.resolve();
            if (g_isloggedIn === true) { // fire $routeChangeSuccess
                console.log('Yes they can!');
                return deferred.promise;
            } else { // fire $routeChangeError
                console.log('No they cant!');
                $location.path('/login');

                // I don't think this is still necessary:
                return $q.reject("'/login'");
            }
        }
    };
};
like image 127
wiherek Avatar answered Oct 23 '22 23:10

wiherek