AngularJS：防止調用多個$ http請求以獲取相同數據

Question

我仍然不了解Promise API的工作方式。 我想知道是否有一種方法可以隨時獲取數據而無需調用多個HTTP請求。 這是一個例子：

會話服務 ：它所做的就是獲取會話對象（包含數據）或獲取返回數字的會話ID。

app.factory('sessionFactory', ['$resource', 'requestFactory',
function ($resource, requestFactory) {

    var oSession = {};

    var session = {
        /**
         * Get session ID
         * @return {Number}
         */
        sessionID: function () {
            if (typeof oSession.id !== "undefined") {
                return oSession.id;
            } else {
                return requestFactory.getObject('/application/current_session').then(function (response) {
                    oSession = response;
                    return oSession.id;
                });
            }
        },

        /**
         * Get session object (GET)
         * @return {Object} data in JSON format
         */
        getCurrentSession: function () {
            if (!oSession.id) {
                return requestFactory.getObject('/application/current_session').then(function (response) {
                    oSession = response;
                    return oSession;
                });
            }
        }
    };

    return session;

}]);

請求HTTP服務 ：此服務僅執行HTTP請求。

app.factory('requestFactory', ['$http', '$q', '$timeout',
function ($http, $q, $timeout) {
    return {
        getObject: function (jsonURL, params) {
            // $q service object
            var deferred = $q.defer();

            // regular ajax request
            $http({
                method: 'GET',
                url: jsonURL,
                params: params
            })
                .success(function (result, status, headers, config) {
                    // promise resolve
                    deferred.resolve(result);
                })
                .error(function (result, status, headers, config) {
                    // called asynchronously if an error occurs
                    // or server returns response with an error status.
                    deferred.reject('Erreur request : ' + status);
                });

            return deferred.promise;
        }
    };
}]);

因此，要獲取我的會話對象，我使用回調函數（then ...）執行sessionFactory.getCurrentSession，它可以完美地工作。 稍后，我只需要獲取會話ID，就可以使用sessionFactory.sessionID，但是僅當我添加了回調函數（然后...）時它才起作用，為什么呢？ 我以為自第一個HTTP請求以來，我的全局JavaScript對象oSession已經具有數據。

我想通過使用更多的對象方法來防止執行意大利面條式的代碼，並保持代碼盡可能的干凈。 可能嗎？

Answer 1

似乎您正在嘗試對Promise API進行過多處理。 它已經內置在$ http服務中，因此您不需要自己調用它。 嘗試以下方法：

app.factory('requestFactory', ['$http',
function ($http) {
    return {
        getObject: function (jsonURL, params) {
            // regular ajax request
            return $http({
                method: 'GET',
                url: jsonURL,
                params: params
            })
                .success(function (result, status, headers, config) {
                    return result;
                })
                .error(function (result, status, headers, config) {
                    // called asynchronously if an error occurs
                    // or server returns response with an error status.
                    throw new Error('Erreur request : ' + status);
                });
        }
    };
}]);

通過返回$ http調用的結果，實際上是在返回一個Promise。 然后，您可以將其他解析代碼鏈接到返回值上。 請參閱$ q文檔的“束縛承諾”部分。

Answer 2

如果您想緩存以前的http響應，這樣就不會再次發出http調用

1. 您可以使用angular-cached-resource

   Bower安裝angular-cached-resource

   angular.module（'myApp'，['ngCachedResource']）

   而不是$resource使用$cachedResource ，它會將網絡調用緩存到本地存儲中，每次您進行調用時，即使它調用了后端並更新了緩存，它也會立即解決。

2. 您還可以使用angular-cache ，它將緩存所有http get調用，您可以設置超時以及在其配置中排除url

涼亭安裝角度緩存