AngularJS:将服务注入到HTTP拦截器中(循环依赖)

19 浏览
0 Comments

AngularJS:将服务注入到HTTP拦截器中(循环依赖)

我正在尝试为我的AngularJS应用编写一个HTTP拦截器来处理身份验证。

这段代码是可行的,但我担心手动注入服务,因为我认为Angular应该自动处理这个问题:

app.config(['$httpProvider', function ($httpProvider) {
    $httpProvider.interceptors.push(function ($location, $injector) {
        return {
            'request': function (config) {
                // 为了解决循环依赖问题而手动注入
                var AuthService = $injector.get('AuthService');
                console.log(AuthService);
                console.log('在请求拦截器中');
                if (!AuthService.isAuthenticated() && $location.path != '/login') {
                    console.log('用户未登录。');
                    $location.path('/login');
                }
                return config;
            }
        };
    })
}]);

我最初尝试的方法,但遇到了循环依赖问题:

app.config(function ($provide, $httpProvider) {
    $provide.factory('HttpInterceptor', function ($q, $location, AuthService) {
        return {
            'request': function (config) {
                console.log('在请求拦截器中。');
                if (!AuthService.isAuthenticated() && $location.path != '/login') {
                    console.log('用户未登录。');
                    $location.path('/login');
                }
                return config;
            }
        };
    });
    $httpProvider.interceptors.push('HttpInterceptor');
});

我担心的另一个原因是Angular文档中关于$http的部分似乎展示了一种将依赖项以“常规方式”注入到HTTP拦截器中的方法。请参见“拦截器”下的代码片段:

// 将拦截器注册为一个服务
$provide.factory('myHttpInterceptor', function($q, dependency1, dependency2) {
  return {
    // 可选方法
    'request': function(config) {
      // 成功时执行某些操作
      return config || $q.when(config);
    },
    // 可选方法
   'requestError': function(rejection) {
      // 错误时执行某些操作
      if (canRecover(rejection)) {
        return responseOrNewPromise
      }
      return $q.reject(rejection);
    },
    // 可选方法
    'response': function(response) {
      // 成功时执行某些操作
      return response || $q.when(response);
    },
    // 可选方法
   'responseError': function(rejection) {
      // 错误时执行某些操作
      if (canRecover(rejection)) {
        return responseOrNewPromise
      }
      return $q.reject(rejection);
    };
  }
});
$httpProvider.interceptors.push('myHttpInterceptor');

以上代码应放在哪里?

我想我的问题是什么是正确的方法?

谢谢,希望我的问题足够清楚。

0