48 votes

AngularJS intercepte toutes les réponses JSON $ http

J'ai une application à l'aide AngularJS et côté serveur backend qui offre toutes les demandes en JSON forme. Chaque demande est enveloppé dans un JSON conteneur qui contient une variable de données qui contient les données spécifiques à la demande. Les autres données, qui sont utilisés pour garder le contrôle et d'état au sein de l'application, vérifier les erreurs et les messages de réussite, et de vérifier pour la session de drapeaux. L'ensemble de ces autres variables sont servis avec CHAQUE demande et sont examinés en premier avant que les données variable.

Droit maintenant, j'ai une méthode pour examiner le contenu de la réponse JSON en premier, puis les données lui-même.

$http.get('something.json').success(function(response) {
   var data = examineJSONResponse(response);
   //do the data stuff
});

Cela fonctionne et le examineJSONResponse prend un coup d'oeil au code et s'il ya quelque chose de mal, puis elle lève une exception et recharge la page à l'aide de la fenêtre.emplacement.href.

Est-il possible que je peux automatiser ce dans AngularJS, de sorte que chaque fois qu'un $http appel est fait, alors il vérifie ce et retourne UNIQUEMENT la variable de données contenu de la réponse JSON?

91voto

Gloopy Points 16421

Vous pouvez intercepter les réponses apportées par l'ajout d'un intercepteur à l' $httpProvider.interceptors Angulaire 1.1.4+ (voir la documentation ici recherche pour intercepteurs).

Pour un type de contenu spécifique comme json, vous pouvez éventuellement refuser les modifications ou lever une exception, même si l'appel a été un succès. Vous pouvez modifier l' response.data qui sera transmis à votre contrôleur de code ici:

myModule.factory('myHttpInterceptor', function ($q) {
    return {
        response: function (response) {
            // do something on success
            if(response.headers()['content-type'] === "application/json; charset=utf-8"){
                // Validate response, if not ok reject
                var data = examineJSONResponse(response); // assumes this function is available

                if(!data)
                    return $q.reject(response);
            }
            return response;
        },
        responseError: function (response) {
            // do something on error
            return $q.reject(response);
        }
    };
});
myModule.config(function ($httpProvider) {
    $httpProvider.interceptors.push('myHttpInterceptor');
});

NOTE: Voici l'original de la réplique pour les versions antérieures à 1.1.4 (responseInterceptors ont été désapprouvées Angulaire 1.1.4):

Peut-être il ya une meilleure façon, mais je pense que vous pouvez faire quelque chose de similaire à ce post avec la réponse http intercepteur (décrit ici) (pour un type de contenu spécifique comme json) où vous pouvez potentiellement refuser les modifications ou lever une exception, même si l'appel a été un succès. Vous pouvez modifier l' response.data qui sera transmis à votre contrôleur de code ici.

myModule.factory('myHttpInterceptor', function ($q) {
    return function (promise) {
        return promise.then(function (response) {
            // do something on success
            if(response.headers()['content-type'] === "application/json; charset=utf-8"){
                // Validate response if not ok reject
                var data = examineJSONResponse(response); // assumes this function is available

                if(!data)
                    return $q.reject(response);
            }
            return response;
        }, function (response) {
            // do something on error
            return $q.reject(response);
        });
    };
});
myModule.config(function ($httpProvider) {
    $httpProvider.responseInterceptors.push('myHttpInterceptor');
});

7voto

matsko Points 5493

Une autre solution consiste à créer un service et à l'utiliser autour de la variable $ http.

 angular.module('App', [])
  .factory('myHttp',['$http',function($http) {
    return function(url, success, failure) {
      $http.get(url).success(function(json) {
          var data = examineJSONResponse(json);
          data && data.success ? success() : failure();
        }).error(failure);
      );
    }
}]);
 

Et maintenant cela peut s'appeler comme:

 myHttp(url, onSuccess, onFailure);
 

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X