500 http Status Routing in angularjs

Question

Ich habe eine angularjs Anwendung, und ich verwende ui-router für Routing.

Ich habe einen Zustand, wie folgend:

.state('core.page500', { 
     url: '/page500', 
     templateUrl: 'views/tmpl/pages/page500.html' 
     }) 

Und ich möchte, dass, wenn einige api Aufruf liefert 500 als HTTP-Status in meiner Anwendung zu routen mich in diesen Zustand.

Ist dies in AngularJS möglich?

Answer 1

Werfen Sie einen Blick auf ein Konzept namens Interceptors.

Sie erstellen im Grunde einen Dienst, der mit jedem $ http-Aufruf ausgelöst wird. Es sieht aus wie folgt:

angular 
    .module('interceptors', []) 
    .factory('HttpInterceptors', HttpInterceptors); 

HttpInterceptors.$inject = ['$q', '$injector']; 

function HttpInterceptors($q, $injector) { 
    return { 
    // On request success 
    request: function (config) { 
     // console.log(config); // Contains the data about the request before it is sent. 

     // Return the config or wrap it in a promise if blank. 
     return config || $q.when(config); 
    }, 

    // On request failure 
    requestError: function (rejection) { 
     //console.log('rejection', rejection); // Contains the data about the error on the request. 

     // Return the promise rejection. 
     return $q.reject(rejection); 
    }, 

    // On response success 
    response: function (response) { 
     // console.log(response); // Contains the data from the response. 

     // Return the response or promise. 
     return response || $q.when(response); 
    }, 

    // On response failture 
    responseError: function (rejection) { 
     if(rejection.status === 500) { 
     var state = $injector.get('$state'); 
     state.go('core.page500'); 
     } 

     // Return the promise rejection. 
     return $q.reject(rejection); 
    } 
    }; 
} 

Dann schieben Sie diese in der $routeProvider im .config Teil Ihrer App:

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

Answer 2

Ja, es ist möglich. Was Sie tun müssen, ist Erstellen Sie eine benutzerdefinierte Interceptor-Factory, die den response.status überprüft und den Umleitungscode bei Status === 500 ausführt und ihn an angularJS-HTTP-Interceptors anfügt.

Docs: https://docs.angularjs.org/api/ng/service/ $ http

Versuchen für AngularJS benutzerdefinierte http Abfangjäger für detaillierte Implementierungen googeln.

Answer 3

Sie können einen Http Interceptor verwenden. Ich habe nicht getestet, so lassen Sie mich wissen, wenn es nicht funktioniert, aber das ist ziemlich nahe, was Sie brauchen:

angular.module('YourModule').factory('errorHttpInterceptor', ['$injector', '$q', '$state', errorHttpInterceptor]); 

    function errorHttpInterceptor($injector, $q, $state) { 
     return { 
      responseError: function (error) { 
       if (error.status === 500) { 
        $state.go('core.page500'); 
       } 
       return $q.reject(error); 
      } 
     }; 
    } 

Und dann in die http-Pipeline hinzuzufügen:

angular.module('YourModule').config(['$httpProvider', config]); 

function config($httpProvider) { 
    $httpProvider.interceptors.push('errorHttpInterceptor'); 
} 

Dies wird alle 500 Fehler abfangen und den Benutzer auf Ihre Fehlerseite senden.