$http 拦截器导致无限循环答案

【问题标题】：$http interceptor is causing an infinite loop$http 拦截器导致无限循环
【发布时间】：2017-10-17 00:34:56
【问题描述】：

我正在构建一个使用自定义 API 的 AngularJs 应用程序，后者需要一个有效的授权令牌，如果不是，我的 API 返回一个 4O1 HTTP 状态代码。

因此，我使用了一个 http 拦截器，它旨在在重试之前的请求之前请求一个新的令牌。

    app.factory('httpResponseErrorInterceptor', ['$q', '$injector', function($q, $injector, $http) {
    return {
        'responseError': function(response) {
            if (response.status === 401) {
                // should retry
                let deferred = $q.defer();
                let $http = $injector.get('$http');
                $.ajax({
                    url        : PUBLIC_API_URI,
                    type       : 'HEAD',
                    beforeSend : function(request) {
                        request.setRequestHeader('Authorization', api_access_key);
                    },
                    success    : function(result, status, xhr) {
                        console.log("error -> ok : should retry");
                        deferred.resolve(xhr.getResponseHeader('Authorization'));
                    },
                    error      : function(xhr, status, error) {
                        console.log("error -> bad : should give up");
                        deferred.resolve(null);
                    }
                });
                console.log(deferred.promise);
                if(deferred.promise == null)
                    return $q.reject(response);
                response.config['Authorization'] = api_access_key = deferred.promise;
                return $http(response.config);
            }

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

我在拦截器中使用了 JQuery.ajax，因为当令牌更新请求导致错误时，我猜想使用 $http 会导致无限循环。但它仍然会导致错误的无限循环：原始请求 -> 更新请求 ...

【问题讨论】：

标签： angularjs http promise infinite-loop

【解决方案1】：

我没有看到错误的完整日志，但我猜这个问题可能与在 http 拦截器中注入 $http 服务（即使您使用 $.ajax 仍然存在）有关。这将导致循环依赖，因为 Angular 将面临一个无限循环，试图解决 $http 及其拦截器的依赖。

看我之前的回答here

如果您需要进行 ajax 调用，请尝试“按需”注入服务

angular.module('myApp').factory('interceptor', function($injector){

  return {
      'responseError': function(response) {
         var http = $injector.get('$http');
         http.get..
       }
  }

});

【讨论】：