fix(service-worker): fixes service worker issue in init-service-worke… (#3378)

This commit is contained in:
Pavan Kumar Jadda 2023-05-09 17:10:09 -04:00 committed by GitHub
parent 0b4c3649e7
commit 55f996cf48
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -3,50 +3,57 @@
// modules, so it's perfectly fine to serve this code to any browsers // modules, so it's perfectly fine to serve this code to any browsers
// (older browsers will just ignore it) // (older browsers will just ignore it)
// //
import { Workbox } from 'https://storage.googleapis.com/workbox-cdn/releases/5.0.0-beta.1/workbox-window.prod.mjs'; //import { Workbox } from './workbox-window.prod.mjs';
// proper initialization
if( 'function' === typeof importScripts) {
importScripts(
'https://storage.googleapis.com/workbox-cdn/releases/6.5.4/workbox-window.prod.mjs'
);
var supportsServiceWorker = 'serviceWorker' in navigator; var supportsServiceWorker = 'serviceWorker' in navigator;
var isNotLocalDevelopment = var isNotLocalDevelopment =
['localhost', '127'].indexOf(location.hostname) === -1; ['localhost', '127'].indexOf(location.hostname) === -1;
if (supportsServiceWorker && isNotLocalDevelopment) { if (supportsServiceWorker && isNotLocalDevelopment) {
const swFileLocation = (window.PUBLIC_URL || '/') + 'sw.js'; const swFileLocation = (window.PUBLIC_URL || '/') + 'sw.js';
const wb = new Workbox(swFileLocation); const wb = new Workbox(swFileLocation);
// Add an event listener to detect when the registered // Add an event listener to detect when the registered
// service worker has installed but is waiting to activate. // service worker has installed but is waiting to activate.
wb.addEventListener('waiting', event => { wb.addEventListener('waiting', event => {
// customize the UI prompt accordingly. // customize the UI prompt accordingly.
const isFirstTimeUpdatedServiceWorkerIsWaiting = const isFirstTimeUpdatedServiceWorkerIsWaiting =
event.wasWaitingBeforeRegister === false; event.wasWaitingBeforeRegister === false;
console.log( console.log(
'isFirstTimeUpdatedServiceWorkerIsWaiting', 'isFirstTimeUpdatedServiceWorkerIsWaiting',
isFirstTimeUpdatedServiceWorkerIsWaiting isFirstTimeUpdatedServiceWorkerIsWaiting
); );
// Assumes your app has some sort of prompt UI element // Assumes your app has some sort of prompt UI element
// that a user can either accept or reject. // that a user can either accept or reject.
// const prompt = createUIPrompt({ // const prompt = createUIPrompt({
// onAccept: async () => { // onAccept: async () => {
// Assuming the user accepted the update, set up a listener // Assuming the user accepted the update, set up a listener
// that will reload the page as soon as the previously waiting // that will reload the page as soon as the previously waiting
// service worker has taken control. // service worker has taken control.
wb.addEventListener('controlling', event => { wb.addEventListener('controlling', event => {
window.location.reload(); window.location.reload();
});
// Send a message telling the service worker to skip waiting.
// This will trigger the `controlling` event handler above.
// Note: for this to work, you have to add a message
// listener in your service worker. See below.
wb.messageSW({ type: 'SKIP_WAITING' });
// },
// onReject: () => {
// prompt.dismiss();
// },
// });
}); });
// Send a message telling the service worker to skip waiting. wb.register();
// This will trigger the `controlling` event handler above. }
// Note: for this to work, you have to add a message
// listener in your service worker. See below.
wb.messageSW({ type: 'SKIP_WAITING' });
// },
// onReject: () => {
// prompt.dismiss();
// },
// });
});
wb.register();
} }