Когда мой сайт был на 100% jQuery, я делал это:
$.ajaxSetup({
global: true,
error: function(xhr, status, err) {
if (xhr.status == 401) {
window.location = "./index.html";
}
}
});
чтобы установить глобальный обработчик для 401 ошибки. Теперь я использую angularjs с $resource
и $http
делать свои (REST) запросы к серверу. Есть ли способ аналогичным образом установить глобальный обработчик ошибок с помощью angular?
javascript
ajax
angularjs
крикардол
источник
источник
Ответы:
Я также создаю веб-сайт с angular, и я столкнулся с тем же препятствием для глобальной обработки 401. Я закончил тем, что использовал http-перехватчик, когда наткнулся на это сообщение в блоге. Может быть, вы найдете его таким же полезным, как и я.
«Аутентификация в приложении на основе AngularJS (или аналогичного)». , программное обеспечение espeo
РЕДАКТИРОВАТЬ: окончательное решение
angular.module('myApp', ['myApp.filters', 'myApp.services', 'myApp.directives'], function ($routeProvider, $locationProvider, $httpProvider) { var interceptor = ['$rootScope', '$q', function (scope, $q) { function success(response) { return response; } function error(response) { var status = response.status; if (status == 401) { window.location = "./index.html"; return; } // otherwise return $q.reject(response); } return function (promise) { return promise.then(success, error); } }]; $httpProvider.responseInterceptors.push(interceptor);
источник
return response || $q.when(response);
чтобы, если ответ пуст, также возвращался объект обещания.Обратите внимание, что responseInterceptors устарела в Angular 1.1.4. Ниже вы можете найти отрывок из официальных документов. , показывающий новый способ реализации перехватчиков.
$provide.factory('myHttpInterceptor', function($q, dependency1, dependency2) { return { 'response': function(response) { // do something on success return response || $q.when(response); }, 'responseError': function(rejection) { // do something on error if (canRecover(rejection)) { return responseOrNewPromise; } return $q.reject(rejection); } }; }); $httpProvider.interceptors.push('myHttpInterceptor');
Вот как это выглядит в моем проекте с использованием Coffeescript:
angular.module("globalErrors", ['appStateModule']).factory "myHttpInterceptor", ($q, $log, growl) -> response: (response) -> $log.debug "success with status #{response.status}" response || $q.when response responseError: (rejection) -> $log.debug "error with status #{rejection.status} and data: #{rejection.data['message']}" switch rejection.status when 403 growl.addErrorMessage "You don't have the right to do this" when 0 growl.addErrorMessage "No connection, internet is down?" else growl.addErrorMessage "#{rejection.data['message']}" # do something on error $q.reject rejection .config ($provide, $httpProvider) -> $httpProvider.interceptors.push('myHttpInterceptor')
источник
responseError
,rejection
есть все , что вам нужно.$httpProvider...
вconfig()
блок?response
наresponseError
функцию не должны быть ссылками наrejection
(или, может быть, имя параметра должно быть изменено наresponse
?Создайте файл
<script type="text/javascript" src="../js/config/httpInterceptor.js" ></script>
с таким содержимым:(function(){ var httpInterceptor = function ($provide, $httpProvider) { $provide.factory('httpInterceptor', function ($q) { return { response: function (response) { return response || $q.when(response); }, responseError: function (rejection) { if(rejection.status === 401) { // you are not autorized } return $q.reject(rejection); } }; }); $httpProvider.interceptors.push('httpInterceptor'); }; angular.module("myModule").config(httpInterceptor); }());
источник