来自 Angular 拦截器的 $http 请求吗？答案

【问题标题】：Do $http request from Angular Interceptor?来自 Angular 拦截器的 $http 请求吗？
【发布时间】：2016-06-28 10:47:23
【问题描述】：

我正在尝试实现 Angular Interceptor for Exceptions。至少一个。我有一个令牌，当它老 enogh 后端抛出 TokenAlmostExpired exception。此异常包含errorCode = 101。在拦截器中，我正在检查代码是否为 101，然后我需要将 POST request 发送到后端的 /refresh endpoint 以便我可以刷新令牌。

.factory('errorInjector',['$injector', function ($q, $injector) {

    var vm = this;

    var errorInjector = {
        'response': function (response) {
            console.log(response);
            return response;
        },
        'responseError': function (rejection) {
            if (JSON.stringify(rejection.data.errorCode) === JSON.stringify(101)) {
                vm.getRefreshToken();
            }
            return $q.reject(rejection);
        }
    };
    return errorInjector;
}]);

和

.config(['$httpProvider', function ($httpProvider) {
        $httpProvider.interceptors.push('errorInjector');
    }]);

$http

但是在拦截器级别有一个问题，我不能让它依赖$http，因为有Circular dependency found: $http <- errorInjector <- $http <- $templateFactory <- $view <- $state

$scope

而且我不能把getRefreshToken() 函数放到$scope，因为$scope 依赖也给出了'循环依赖'。

$Injector

var http = $injector.get('$http');

效果不佳，并给我错误。

那么我怎样才能在拦截器中捕获异常，然后从那里发出 $http 请求呢？

【问题讨论】：

您可能需要考虑触发一个事件，然后在服务中获取它并从那里执行
不要使用 rootscope，创建自己的事件聚合器...
你能显示完整的errorInjector代码吗？好像还没有完全实现。
我们不需要完整的errorInjector代码，那里已经足够了
@ottercoder 如果您不了解@CallumLinington 代码，您似乎不了解角度的DI，这就是为什么您有'$injector', function ($q, $injector) 应该是'$q', '$injector', function ($q, $injector)，这可能是您的问题跨度>

标签： javascript angularjs interceptor angular-http-interceptors

【解决方案1】：

拦截器

(function (angular) {
    'use strict';

    angular.module('services').factory("httpInterceptor", [
        'errorLauncher',
        '$q',
        function (errorLauncher, $q) {
            return {
                'requestError': function (rejection) {
                    if (rejection.status === 101) {
                        errorLauncher.pushInErrorMessage(rejection);
                    }
                    return $q.reject(rejection);
                },
                'responseError': function (rejection) {
                    if (rejection.status === 101) {
                        errorLauncher.pushInErrorMessage(rejection);
                    }
                    return $q.reject(rejection);
                }
            };
        }]);
})(angular);

和错误处理服务

(function (angular) {
    'use strict';

    angular.module('services').factory("errorLauncher", [
        '$rootScope',
        function ($rootScope) {
            return {
                'pushInErrorMessage': function (rejection) {
                    $rootScope.$emit('theTokenWillDieSoon');
                }
            };
        }]);
})(angular);

现在是主应用控制器

(function (angular) {
    'use strict';

    angular.module('controllers').controller("globalCtrl", [
        '$rootScope',
        '$http',
        function ($rootScope, $http) {
            $rootScope.$on('theTokenWillDieSoon', function () {
                // http from here
            });
        }]);
})(angular);

【讨论】：

Circular dependency found: $http <- errorLauncher <- httpInterseptor <- $http <- $templateFactory <- $view <- $state :/
从错误处理程序中尝试 $emit 然后）希望它会有所帮助

【解决方案2】：

.factory('errorInjector',['$injector', function ($q, $injector) { .... }]);

更改为：

.factory('errorInjector',['$q', function ($q) { .... }]);

【讨论】：

【解决方案3】：

所以我已经完成了服务。谢谢大家！

拦截器：

.factory('errorInjector',['$injector', function ($q, $injector) {

    var errorInjector = {
        'response': function (response) {
            ....
        },
        'responseError': function (rejection) {
            if (JSON.stringify(rejection.data.errorCode) === JSON.stringify(101)) {
                var refreshTokenService = $q.get('refreshTokenService');
                refreshTokenService.refreshTokenService();
                $.notify({message: data.data.detailMessage}, {type: 'warning'});
            }
            return $q.reject(rejection);
        }
    };

    return errorInjector;
}]);

刷新令牌服务：

.service('refreshTokenService', ['$http', function ($http) {

    this.refreshTokenService = function () {
        $http.post('/refresh').then(
            function success(response) {
               .....
            },
            function error(data) {
                .....
            }
        );
    };

}]) ;

【讨论】：