What is alternative of $httpProvider.responseInterceptors as it is discontinued in AngularJS V1.3?
My interceptors which was working with Angular JS 1.2 is now not working with version 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));
}
};
});
});
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
// 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)
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With