How can we notify to the Angular cache if any new update available in Database without setting any time limit to refresh to fetch the latest data from Database?

[Santosh Andawarapu]

I have been reading about the new Service Workers support for Angular 5 and Angular CLI and I found it fascinating. I'm particularly interested in caching API end points. In all the tutorials I have read, they all seem to focus on caching end point calls once and then serving future requests from the cache storage. What if my web application frequently updates or inserts data? All my requests would still continue being served from the cache which will result in fetching old data and not the new data that I just updated or inserted which would only be retrieved if I make a new call to the API end point. How can we keep this in sync?

To make my question a bit clear; In short what I am asking for is how can you refresh your cache based on your need.I understand that If I pick 'freshness' strategy, it will always fetch from network except at the time of network failure or time out in which case it defaults to the cache. If I pick 'performance' strategy, it will always serve from cache and will not be suitable for things that change often. What I'm looking for is a little bit of both. I would like it to always serve from the cache except in the case where I specifically tell it not to. For example when I create new customer, I would like to refresh the cache and then it continues to serve from the cache until I tell it to refresh otherwise.

[Sander Elias]

Hi Santosh,

That would be the holy grail ;)
The simplest way would to invalidate/empty the cache when you do a write transaction to a certain endpoint. You can do this by using fetchEvent to fire on put/post/delete. Then in that function use the cache/cacheStroage to remove the current cache for that end-point.

Regards
Sander

​