When I switched my web application from App Cache to Service Workers some browsers require clear cache - service-worker

Question

I had App Cache working correctly for offline capability for our web app but I was tasked with switching to service workers because several major browsers have threatened that app cache support may be dropped at any time. I was able to get service workers to work fine but the problem comes when an end-user device using the app with app cache does not load the new service worker without having to clear the browser cache manually (in settings).
The service worker version works great for any device that never used the app with the app cache version or had cache manually cleared.
Is there something that I should be doing when setting up the service worker to force a change for the app cache version?
The app is using ASP.NET and the service worker code is in the Global.master which is included in every page.
Global.master
--------------------------------------------------
if ('serviceWorker' in navigator)
{
navigator.serviceWorker
.register('/Service_Worker.js')
.then(function (registration)
{
console.log("Service Worker Registered");
})
.catch(function (err)
{
console.log("Service Worker registration failed");
});
}
else
{
console.log('service worker not supported.');
}
Service_Worker.js
--------------------------------------------------
self.addEventListener('install', function (e)
{
self.skipWaiting();
e.waitUntil(
caches.open(cacheName).then(function (cache)
{
return cache.addAll(appShellFiles);
})
);
});
// Fetching content using Service Worker
self.addEventListener('fetch', function (e)
{
e.respondWith(
caches.match(e.request).then(function (r)
{
return r || fetch(e.request).then(function (response)
{
return caches.open(cacheName).then(function (cache)
{
cache.put(e.request, response.clone());
return response;
});
});
})
);
});
self.addEventListener('activate', function (e)
{
e.waitUntil(
caches.keys().then(function (keyList)
{
return Promise.all(keyList.map(function (key)
{
if (cacheName.indexOf(key) === -1)
{
return caches.delete(key);
}
}));
})
);
});
Expected Results: devices running application cache should work with service workers after the app is updated
Actual Results: Until the device previously running application cache version has cache cleared it continues running client-side code from the previous version's cache.

Answer 1

most likely the user is still fetching from appCache since that is registered. You need to bypass the cached asset(s) to trigger a trip to your server to get the updated code.