Angular decorator, interceptor in a Global error Handler

1. Decorator &
Interceptor
@cbalit

2. P.
LE CONTEXTE

3. SOURCES D’ERREURS
Application Serveur
runtime
http

4. GLOBALERRORHANDLER
Un service GlobalErrorHandler pour centraliser la stratégie
● message dans l’application
● trace local
● envoi au serveur ...
.factory('GlobalErrorHandler', function ($window) {
var service = {
error: function (error) {
},
ajaxError: function (rejection) {.
},
};
return service;
});

5. POUR LES APPELS HTTP
● Création d’un service Interceptor: objet implémentant 4 méthodes:
○ request
○ requestError
○ response
○ responseError
● Enregistrer notre interceptor dans le $httpProvider.interceptors
.factory('errorHttpInterceptor', function ($q, GlobalErrorHandler) {
return {
responseError: function responseError(rejection) {
GlobalErrorHandler.ajaxError(rejection);
return $q.reject(rejection);
}
};
})
.config(['$httpProvider', function ($httpProvider) {
$httpProvider.interceptors.push('errorHttpInterceptor');
}])

6. UN DECORATOR
“Surcharge un service tout en gardant la main sur l’ancienne implémentation”
❏ $provide.decorator
❏ dans un bloc config
❏ Ok pour l’injection de dépendances
❏ yo angular:decorator MyService
.config(function ($provide) {
$provide.decorator('MyService', function ($delegate) {
// decorate the $delegate
return $delegate;
});
});

7. POUR LE RUNTIME
On doit être notifier de toutes les erreurs pouvant se produire
● window.onerror
$provide.decorator('$window', function ($delegate,GlobalErrorHandler) {
$delegate.onerror = function (errorMsg, url, lineNumber) {
var error = new Error(errorMsg, url, lineNumber);
GlobalErrorHandler.error(error);
};
return $delegate;
});

8. POUR LE RUNTIME
On doit être notifier de toutes les erreurs pouvant se produire
● $exceptionHandler
$provide.decorator('$exceptionHandler', function (GlobalErrorHandler,$delegate) {
return function (exception, cause) {
GlobalErrorHandler.error(exception);
$delegate(exception, cause);
};
});

9. DÉMO

10. RÉFÉRENCES
● https://github.com/cbalit/angular-error
● https://docs.angularjs.org/api/auto/object/$provide
● https://docs.angularjs.org/api/ng/service/$http
● http://bahmutov.calepin.co/catch-all-errors-in-angular-app.html

11. http://sfeir.angularjs.expert