Typescript Snippet - $httpProvider

Mit Hilfe des Angular $httpProvider Providers, kann auf einfache Art und Weise das Verhalten des $http Services beeinflusst werden. Ein typisches Szenario ist die Registration eines eigenen Http-Interceptors um Fehlermeldungen abzufangen oder Request-Headers zu setzen.

Für Typescript bietet sich dazu das Interface ng.IHttpInterceptor an. Mit Hilfe einer Factory wird einer neue Instanz des Http-Interceptors erzeugt, und über den $httpProvider registriert.

namespace App {
    'use strict';

    class MyHttpInterceptor implements ng.IHttpInterceptor {

        constructor(myService: App.MyService) {
        }

        public request = (config : ng.IRequestConfig): ng.IRequestConfig => {
            config.headers["X-MyCustom-Header"] = myService.getValue();
            return config;
        }
        
        public requestError = (rejection: any) : any => {
            console.error(rejection);
        }

        public response = <T>(response: ng.IHttpPromiseCallbackArg<T>) : ng.IHttpPromiseCallbackArg<T> => {
            return response;
        }

        public responseError = (rejection: any) : any => {
            console.log(rejection);
        }
    }

    factory.$inject = ["MyService"];
    function factory(myService: App.MyService): ng.IHttpInterceptor {
        return new MyHttpInterceptor(myService);
    }

    configureHttpProvider.$inject = ["$httpProvider"];
    function configureHttpProvider($httpProvider: ng.IHttpProvider) {
        $httpProvider.interceptors.push(factory);
    }

    angular.module("app").config(configureHttpProvider);
}