diff --git a/frontend/src/registerServiceWorker.js b/frontend/src/registerServiceWorker.js index 76cede0..3caa896 100644 --- a/frontend/src/registerServiceWorker.js +++ b/frontend/src/registerServiceWorker.js @@ -2,6 +2,12 @@ import { register } from 'register-service-worker' +const notifyAboutUpdate = worker => { + if (confirm('New version available, update?')) { + worker.postMessage({ action : "skipWaiting"}) + } +} + if (process.env.NODE_ENV === 'production') { register(`${process.env.BASE_URL}service-worker.js`, { ready () { @@ -19,8 +25,9 @@ if (process.env.NODE_ENV === 'production') { updatefound () { console.log('New content is downloading.') }, - updated () { - console.log('New content is available; please refresh.') + updated (registration) { + console.log('New content is available; please refresh.') + notifyAboutUpdate(registration.waiting) }, offline () { console.log('No internet connection found. App is running in offline mode.') @@ -28,5 +35,12 @@ if (process.env.NODE_ENV === 'production') { error (error) { console.error('Error during service worker registration:', error) } - }) + }) + + var refreshing; + navigator.serviceWorker.addEventListener("controllerchange", function () { + if (refreshing) return; + window.location.reload(); + refreshing = true; + }) } diff --git a/frontend/src/service-worker.js b/frontend/src/service-worker.js new file mode 100644 index 0000000..af0d010 --- /dev/null +++ b/frontend/src/service-worker.js @@ -0,0 +1,9 @@ +self.__precacheManifest = [].concat(self.__precacheManifest || []); +workbox.precaching.suppressWarnings() +workbox.precaching.precacheAndRoute(self.__precacheManifest, {}) + +self.addEventListener('message', msg => { + if (msg.data.action == 'skipwaiting') { + self.skipWaiting(); + } +}) \ No newline at end of file diff --git a/frontend/vue.config.js b/frontend/vue.config.js index b31de94..139b4bb 100644 --- a/frontend/vue.config.js +++ b/frontend/vue.config.js @@ -1,5 +1,3 @@ -const { GenerateSW } = require("workbox-webpack-plugin"); - module.exports = { publicPath: "./", pwa: { @@ -10,16 +8,10 @@ module.exports = { }, workboxPluginMode: 'InjectManifest', workboxOptions: { - swSrc: 'src/registerServiceWorker.js' + swSrc: 'src/service-worker.js' } }, configureWebpack: { - plugins: [new GenerateSW({ - clientsClaim: true, - skipWaiting: true, - cleanupOutdatedCaches: true, - navigateFallback: 'index.html', - })], output: { crossOriginLoading: 'anonymous' },