Кеш AngularJS $http.get не работает

Question

После следующей (Маршрутной) на другую страницу вернитесь, она все равно перезвонит по ссылке. Как кэшировать данные JSON из http-вызова, чтобы оптимизировать производительность?

Попробуйте какое-то решение, но оно не работает

$http.get(url, { cache: true}).success(...);

Есть ли лучшее решение для этого?

Answer 1

Лучший способ сделать CacheFactory как:-

 var cache = $cacheFactory('myCache');

 var data = cache.get(anyKey);

 if (!data) {
   $http.get(url).success(function(result) {
      data = result;
      cache.put(anyKey, data);
   });
 } 

Answer 2

Вы также можете использовать директиву angular-data для кэширования. Это позволяет вам указать, где кэширование: локальное хранилище / сеанс / память, и вы можете установить время, в которое вы хотите хранить ваши запросы в кэше.

http://angular-data.pseudobry.com/documentation/guide/angular-cache/index

Чтобы инициализировать кеш, добавьте этот код в функцию app.run():

     DSCacheFactory('defaultCache', {
        maxAge: 900000, // Items added to this cache expire after 15 minutes.
        cacheFlushInterval: 6000000, // This cache will clear itself every hour.
        deleteOnExpire: 'aggressive', // Items will be deleted from this cache right when they expire.
        storageMode:'memory' // [default: memory] sessionStorage, localStorage
    });

    $http.defaults.cache = DSCacheFactory.get('defaultCache');

А затем используйте его в своем коде, как вы сделали:

$http.get(url, { cache: true}).success(...);

Answer 3

Я рекомендую вам скачать angular-cache! Это очень полезная замена Angache's $cacheFactory

Внутри блока.run() определите ваш кеш:

.run(function (DSCacheFactory) {
    DSCacheFactory("dataCache", { 
        storageMode: "localStorage",
        maxAge: 720000, // time in milliseconds
        deleteOnExpire: "aggressive"
    });
}

Затем внутри вашей Службы вы можете управлять тем, как использовать ваши данные, получать их из Cache по истечении срока их действия, совершать новый вызов и обновлять данные.

(function (){
'use strict';

app.factory('DataService', ['$http','$q','DSCacheFactory',DataService]);

function DataService($http, $q,DSCacheFactory){
    self.dataCache= DSCacheFactory.get("dataCache");

self.dataCache.setOptions({
        onExpire: function(key,value){
            getData()
                .then(function(){
                    console.log("Data Cache was automatically refreshed", new Date());
                }, function(){
                    console.log("Error getting data. Putting expired info again", new Date());
                    // This line of code will be used if we want to refresh data from cache when it expires
                    self.dealerListCache.put(key,value);
                });
        }
    });

function getData(){
        var deferred = $q.defer(),
            cacheKey = "myData",
            dataFromHttpCall = self.dataCache.get(cacheKey);

        if(dataFromHttpCall){
            console.log("Found in cache");
            deferred.resolve(dealersList);
        } else {
            $http.get('/api/dataSource')
                .success(function (data) {
                    console.log("Received data via HTTP");
                    self.dataCache.put(cacheKey, data);
                    deferred.resolve(data);
                })
                .error(function () {
                    console.log('Error while calling the service');
                    deferred.reject();
                });
        }

        return deferred.promise;
    }
};

})();

Это все!