在401状态代码上重定向页面

时间:2014-05-21 07:59:25

标签: javascript angularjs angular-ui-router

我正在使用AngularJS和angular ui路由器设置授权。 如果用户尝试访问需要授权的路由,则服务器返回401状态代码。

我创建了一个HTTP响应拦截器,用于检查401状态代码。 如果代码是401,则应该重定向到登录页面,但这不起作用。 它捕获401,但不重定向。以下是拦截器的代码:

app.config(['$httpProvider', function ($httpProvider) {
    // This is just for to check for XHR requests on the server
    $httpProvider.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';

    $httpProvider.responseInterceptors.push(['$q', '$location', function ($q, $location) {
        return function (promise) {
            return promise.then(

                // Success: just return the response
                function (response) {
                    return response;
                },

                // Error: check the error status to get only the 401
                function (response) {
                    if (response.status === 401)
                        $location.url('/users/login');

                    return $q.reject(response);
                }
            );
        }
    }]);
}]);

编辑:如果我这样做,似乎有效:

$timeout(function() { $location.url('/users/login'); }, 0);

我想这会把它放在执行堆栈中并改变执行上下文。有没有人知道更多关于这一点,或者这确实有效或只是这样吗?

4 个答案:

答案 0 :(得分:0)

我添加了同样的问题。所以我改变了我的代码以使用$ location.path(而不是url)

 $location.path("/users/login");

你能试试吗

angular.module('yourApp').config(function ($httpProvider) {

  var logsOutUserOn401 = ['$q', '$location', function ($q, $location) {
    var success = function (response) {
      return response;
    };

    var error = function (response) {
      if (response.status === 401) {
        //redirect them back to login page
        $location.path('/login');

        return $q.reject(response);
      } 
      else {
        return $q.reject(response);
      }
    };

    return function (promise) {
      return promise.then(success, error);
    };
  }];

  $httpProvider.responseInterceptors.push(logsOutUserOn401);
});

(来源:http://arthur.gonigberg.com/2013/06/29/angularjs-role-based-auth/

答案 1 :(得分:0)

我使用

$window.location.href='...'

答案 2 :(得分:0)

我终于解决了它,但我仍然不知道为什么它不起作用。无论如何,我不得不使用它来重定向:(状态转换)

$injector.get('$state').transitionTo('users.login');

答案 3 :(得分:0)

这就是我们在项目中添加响应拦截器的方式。它为我们工作。

$httpProvider.interceptors.push(function($q, $rootScope, $location,
                                        $cookieStore) {
                                    return {
                                        'responseError' : function(
                                                rejection) {
                                            var status = rejection.status;
                                            var config = rejection.config;
                                            var method = config.method;
                                            var url = config.url;

                                            if (status == 401) {

                                                $rootScope.shouldRedirect = true;
                                                $rootScope.urlAttempted = url;

                                                $location
                                                        .path("/login");

                                            } else if (status == 403) {

                                                $location
                                                        .path("/accessForbidden");

                                            } else {

                                            }

                                            return $q.reject(rejection);
                                        }
                                    };
                                });