Once everything is ready, you should be able to intercept requests with your service workers with the fetch event, in the following way:
self.addEventListener('fetch', e => { e.respondWith(async function() { const response = await caches.match(e.request); if(response) { return response; } return fetch(e.request); }());});
Hang on! Let's see what happened here:
- This listener will be fired whenever the browser makes a fetch request under its registration scope (we discussed that earlier).
- respondWith also accepts a promise, which we gave it.
- Then, we check whether or not the requested file is already present in our cache (using catches.match(e.request)). If it is, we return the cached file directly. If not, we ...
