javascript $httpProvider.responseInterceptors 的替代方案

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/23804981/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-28 01:35:44  来源:igfitidea点击:

Alternative of $httpProvider.responseInterceptors

javascriptangularjsinterceptor

提问by Vipul

What is alternative of $httpProvider.responseInterceptors as it is discontinued in AngularJS V1.3?

$httpProvider.responseInterceptors 的替代品是什么,因为它在 AngularJS V1.3 中已停止使用?

My interceptors which was working with Angular JS 1.2 is now not working with version 1.3

我使用 Angular JS 1.2 的拦截器现在不适用于 1.3 版

var angularErrorHandling = angular.module('xx-http-error-handling', []);
angularErrorHandling.config(function ($provide, $httpProvider, $compileProvider) {
    var elementsList = $();

     push function to the responseInterceptors which will intercept 
     the http responses of the whole application
    $httpProvider.responseInterceptors.push(function ($timeout, $q) {
        return function (promise) {
            return promise.then(function (successResponse) {                
                // if there is a successful response on POST, UPDATE or DELETE we display
                // a success message with green background
                if (successResponse.config.method.toUpperCase() == 'GET') {
                    var length = successResponse.data.length;                    
                    if (length == 0)
                    {
                        var countactivetoaster = $('#toast-container').find('.toast').length;
                        if (countactivetoaster == 0) {
                            toastr.warning('No Records Found!', '');
                        }
                    }                    
                    return successResponse;
                }
                else if (successResponse.config.method.toUpperCase() == 'PUT') {                   
                    toastr.success('Data Saved Sucessfully..', '');
                    return successResponse;
                }
                else if (successResponse.config.method.toUpperCase() == 'POST') {                   
                    toastr.success('Data Saved Sucessfully..', '');
                    return successResponse;
                }
            },
            // if the message returns unsuccessful we display the error 
            function (errorResponse) {
                switch (errorResponse.status) {
                    case 400: // if the status is 400 we return the error                           
                        toastr.error('400 error.', '');
                        // if we have found validation error messages we will loop through
                        // and display them
                        if (errorResponse.data.errors.length > 0) {
                            for (var i = 0; i < errorResponse.data.errors.length; i++) {
                                toastr.error('xx-http-error-validation-message', '');
                            }
                        }
                        break;
                    case 401: // if the status is 401 we return access denied                            
                        toastr.error('Wrong email address or password!', '');

                        break;
                    case 403: // if the status is 403 we tell the user that authorization was denied                          
                        toastr.error('You have insufficient privileges to do what you want to do!', '');
                        break;
                    case 500: // if the status is 500 we return an internal server error message                            
                        toastr.error('Error: <br />' +
                            errorResponse.data.exceptionMessage != null && errorResponse.data.exceptionMessage.length > 0 ? errorResponse.data.exceptionMessage : 
                            errorResponse.data.message, '');
                        break;
                    default: // for all other errors we display a default error message                            
                        toastr.error('Error ' + errorResponse.status + ': ' + errorResponse.data.message, '');
                }
                return $q.reject(errorResponse);
            });
        };
    });

    $compileProvider.directive('httpErrorMessages', function () {
        return {
            link: function (scope, element, attrs) {
                elementsList.push($(element));
            }
        };
    });
});

回答by Cétia

You have to use the new interceptor syntax (which is cleaner/better in my view) :

您必须使用新的拦截器语法(在我看来更干净/更好):

You'll see that now, you can handle 4 interceptors separately : request, requestError, response, responseError

现在你会看到,你可以分别处理 4 个拦截器:请求、请求错误、响应、响应错误

// register the interceptor as a service
  $provide.factory('myHttpInterceptor', function($q, dependency1, dependency2) {
    return {
      // optional method
      'request': function(config) {
        // do something on success
        return config;
      },

      // optional method
     'requestError': function(rejection) {
        // do something on error
        if (canRecover(rejection)) {
          return responseOrNewPromise
        }
        return $q.reject(rejection);
      },



      // optional method
      'response': function(response) {
        // do something on success
        return response;
      },

      // optional method
     'responseError': function(rejection) {
        // do something on error
        if (canRecover(rejection)) {
          return responseOrNewPromise
        }
        return $q.reject(rejection);
      }
    };
  });

  $httpProvider.interceptors.push('myHttpInterceptor');

More informations : https://docs.angularjs.org/api/ng/service/$http(Interceptor chapter)

更多信息:https: //docs.angularjs.org/api/ng/service/$http(拦截器章节)