49

AngularJSと、すべてのリクエストをJSON形式で配信するサーバー側のバックエンドを使用して構築されたアプリケーションがあります。すべてのリクエストは、リクエストに固有のデータを含むデータ変数を含むJSONコンテナにラップされます。アプリケーション内の状態と制御を維持し、エラーと成功メッセージをチェックし、セッションフラグをチェックするために使用されるその他のデータ。これらの他のすべての変数はすべてのリクエストで提供され、データ変数がである前に最初に調べられます。

現在、最初にJSON応答の内容を調べ、次にデータ自体を調べる方法があります。

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

これは機能し、examineJSONResponseはコードを調べ、何か問題がある場合は例外をスローし、window.location.hrefを使用してページをリロードします。

AngularJS内でこれを自動化して、$ http呼び出しが行われるたびにこれをチェックし、データ変数の内容のみをJSON応答として返すようにする方法はありますか?

4

2 に答える 2

93

$httpProvider.interceptorsAngular 1.1.4+でインターセプターを追加することで応答をインターセプトできます(インターセプターについては、こちらのドキュメントを参照してください)。

jsonのような特定のコンテンツタイプの場合、呼び出しが成功した場合でも、変更を拒否したり、例外をスローしたりする可能性があります。response.dataここでも、コントローラーコードに渡されるを変更できます。

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');
});

注: 1.1.4より前のバージョン(responseInterceptorsAngular 1.1.4で非推奨)の元の回答は次のとおりです。

より良い方法があるかもしれませんが、呼び出しが成功したにもかかわらず、変更を拒否したり例外をスローしたりする可能性のあるhttp応答インターセプター(ここで説明)(jsonなどの特定のコンテンツタイプ用)を使用して、この投稿と同様のことを行うことができると思います。ここでも、コントローラーコードに渡されるを変更できます。response.data

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');
});
于 2012-08-14T17:38:45.490 に答える
7

別の解決策は、サービスを作成し、それを$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);
      );
    }
}]);

そして今、これは次のように呼び出すことができます:

myHttp(url, onSuccess, onFailure);
于 2012-08-15T02:28:25.297 に答える