REST service caching strategy using AngularJS

Question

I have an AngularJS application and I want to cache REST service responses. I found several libraries, such as angular-cached-resource , that can do this by storing data in a local web browser repository.

But sometimes I make POST / PUT / DELETE REST calls, and then some of the previous REST service cache requests need to be executed again. Thus, it seems that you can delete the cached responses, and then the call will be sent to the server next time.

But what about whether the server sends some values ​​to the HTTP Header , such as expires or etag ? Should I read the HTTP header and respond myself, or is there a library in AngularJS that can handle this too?

So, if I have to hit the server and not read the local storage cache, it depends on the HTTP header cache fields and if there are any PUT / POST / DELETE calls that have an answer, for example, "reset each user" settings item. Therefore I have to accept this answer and create a card that tells me that, for example, the REST services A, C and F (related to the user settings) should again get to the server the next time they are executed, or if Cache expires from HTTP headers.

Is this possible using the AngularJS library or do you have other recommendations? I think it looks like an Observer or PubSub Pattern, right?

One more thing . Is it possible to have something like PubSub without using the cache / local storage (same as the HTTP Header cache controls)? Therefore, I can’t call the REST service, because then it will go to a server that I don’t need in some cases (a response from a previous REST call that returns the event “reload of each user settings element” event).

Answer 1

You can try something like this.

 app.factory('requestService', ['$http', function ($http) { var data = {}; var service = { getCall : funtion(requstUrl, successCallback, failureCallback, getFromCache){ if(!getFromCache){ $http.get(requstUrl) .success(function(data){ successCallback(data); data.requstUrl = data; }) .error(function(){ failureCallback(data); }) }else{ successCallback(data.requstUrl); } }, postCall : function(requestUrl, paramToPass, successCallback, failureCallback, getFromCache){ if(!getFromCache){ $http.post(requestUrl, paramToPass) .success(function(data){ successCallback(data); data.requstUrl = data; }) .error(function(data){ failureCallback(data); }) }else{ successCallback(data.requstUrl); } } }; return service; }]); 

This is a simple code that I wrote to implement your concept. I have not tested it and everything is yours.