We are using Angular 8 with .NET Web API. Recently we made a major change on UI side, which impacted end users, because service worker is not applying the latest changes from server immediately. Latest updates are applied on end user browser only after refreshing the browser or reopening the browser in next tag. But we want to refresh the browser immediately once the update is available. Under developer tools we can see Service worker is pulling the latest changes, but not applying immediately. Below picture from my browser - Service Worker showing the update available in browser We tried to create our own ngsw-serviceworker.js file, but after post deployment script we can't see our own file. Angular creating default ngsw-serviceworker.js from service worker package. This is the piece of code we wrote for force refresh if any update is available. But no luck, even this code is applying only if browser if reopened. version we used - "@angular/service-worker": "8.2.14", Angular 8. Angular.json "serviceWorker": true, "ngswConfigPath": "ngsw-config.json" App.Component.ts: (below is the code we wrote in constructor) if (this.swUpdate) { this.swUpdate.available.subscribe((event) => { console.log(`current`, event.current, `available `, event.available); this.swUpdate.activateUpdate().then(() => { location.reload(); } ); }); Can someone please help us to find the solution, to apply html/js/CSS changes on user browser from server or reload the browser immediately once the service worker update is available. Our UI code is deployed on cloud, AWS. Continue reading...
