Кэширование отклика json с сервера и автоматическое определение момента изменения данных

Question

Я работаю над угловым приложением, которое выполняет вызовы на сервер и получает данные JSON. Я смотрю на кэширование этих данных JSON.

Подход пробовал:

1) Я попытался использовать html5 localSorage, чтобы сохранить данные локально. Но проблема в том, что я должен вручную установить время истечения, и нет никакого способа узнать, как иногда данные будут меняться.

2) Я попытался использовать $cacheFactory, однако это не кэширует данные при обновлении или переходах по страницам.

Решение, которое я ищу,

Я хочу, чтобы данные были сохранены локально или кэшированы. И использовать некоторый механизм, чтобы обнаружить, изменились ли данные, возвращаемые сервером (данные JSON), и только затем сделать вызов.

Возможно ли это каким-либо образом?

Answer 1

Я надеюсь, что вы получаете данные из HTML, вызываете веб-сервис и сохраняете данные в локальном хранилище. В $http Успешно вызвать функцию, которая хранит данные в локальном хранилище.

setUserDetails = function(userData){
var username = "";
if(userData != null){
app.setInLocalStorage("loginName",userData.userName);}
}

где userData похож на объект, содержащий ваши HTML-данные,

var userData= {
 userName : $scope.userName,
 };

Получить userData.userName из локального хранилища

 var userLoggedIn = app.retrieveFromLocalStorage("userName");

сравнить данные это изменило с сервера или нет

if(userLoggedIn != null){
            //call the service which gives dynamic response 
            //i hope your saving the success data in userData and userName is property which changes dynamically 
         var newUser = userData.userName;
        if(angular.equals(userLoggedIn, newUser){
             // maintain the same data in localstorage 
                        //or
               //No need to call any other function calls
         }else{    
                  //clear the old data from local storage 
                      app.clearLocalStorage();
                 //storage the new dynamic data in local storage 
                           //or
                  //call the new function calls if you need 
                app.setInLocalStorage("loginName",newUser)
             }
}

В файле app.js включите следующие строки для хранения, восстановления, очистки локального хранилища

setInLocalStorage : function(key , value) {
            // Check browser support
            if (typeof(Storage) != "undefined")
            {
                // Store
                localStorage.setItem(key , value);
            }
            else
            {
                alert("Sorry, your browser does not support Web Storage...");
            }
        },
       retrieveFromLocalStorage : function(key){
        return localStorage.getItem(key);
    },

    clearLocalStorage : function(){
        localStorage.clear();
    }