This plugin adds Service Worker support to Cordova apps on iOS. To use it:
sw.js
in your www/
directory.Add the following preference to your config.xml file:
<preference name="ServiceWorker" value="sw.js" />
That's it! Your calls to the ServiceWorker API should now work.
This plugin automatically creates a cache (called Cordova Assets
) containing all of the assets in your app's www/
directory.
To prevent this automatic caching, add the following preference to your config.xml file:
<preference name="CacheCordovaAssets" value="false" />
One use case is to check your caches for any fetch request, only attempting to retrieve it from the network if it's not there.
self.addEventListener('fetch', function(event) {
event.respondWith(
// Check the caches.
caches.match(event.request).then(function(response) {
// If the response exists, return it; otherwise, fetch it from the network.
return response || fetch(event.request);
})
);
});
Another option is to go to the network first, only checking the cache if that fails (e.g. if the device is offline).
self.addEventListener('fetch', function(event) {
// If the caches provide a response, return it. Otherwise, return the original network response.
event.respondWith(
// Fetch from the network.
fetch(event.request).then(function(networkResponse) {
// If the response exists and has a 200 status, return it.
if (networkResponse && networkResponse.status === 200) {
return networkResponse;
}
// The network didn't yield a useful response, so check the caches.
return caches.match(event.request).then(function(cacheResponse) {
// If the cache yielded a response, return it; otherwise, return the original network response.
return cacheResponse || networkResponse;
});
})
);
});