Progressive Web Application Development by Example

Executing ResponseManager

Instead of writing a complex routine to fetch and cache a response directly in the service worker's fetch event handler, you can use the ResponseManager. Because the caching strategy logic is contained within the module, you can pass the request and cacheName to have it execute:

self.addEventListener("fetch", event => { 
 
    let cacheName = getCacheName(event.request.url); 
 
    event.respondWith( 
 
        responseManager.cacheFallingBackToNetworkCache(event.request,         cacheName) 
        .then(response => { 
     
          invalidationManager.cacheCleanUp(cacheName); 
     
          return response;     
        })     
    ); 
}); 

In this example, the response is returned as a result of the promise chain. It also executes the cache's InvalidatationManager.cacheCleanUp method to make sure that ...