401状态码重定向页面答案

【问题标题】：Redirecting page on 401 status code401状态码重定向页面
【发布时间】：2015-03-18 16:29:21
【问题描述】：

我正在使用 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);

我猜这会将它放在执行堆栈的最后并更改执行上下文。有没有人对此了解更多，或者这是否确实有效或只是看起来有效？

【问题讨论】：

标签： javascript angularjs angular-ui-router

【解决方案1】：

我添加了同样的问题。所以我改变了我的代码以使用 $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/）

【讨论】：

这似乎对我不起作用。我怀疑它可能与执行上下文、返回语句或两者都有关。

【解决方案2】：

我可以使用它

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

【讨论】：

【解决方案3】：

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

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

【讨论】：

【解决方案4】：

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

$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);
                                        }
                                    };
                                });

【讨论】：