javascript - Hur testar jag att uppdatera en service worker i en utvecklingsmiljö?

Det jag skulle vilja uppnå är möjligheten att skicka en notifikation till användaren när en uppdatering är tillgänglig för min React-webbsida, och jag försöker göra detta via serviceWorkers.

Utmaningen jag står inför är att få installations-egenskapen hos serviceWorkerRegistration-gränssnittet att inte returnera null. Jag vill bara trigga console.log('Nytt innehåll finns tillgängligt; vänligen uppdatera.')

Jag är ganska ny på att arbeta med serviceWorkers i React. Har någon en idé om hur man kan testa uppdateringsfunktionen för serviceWorkers i en utvecklingsmiljö?

  console.log('I am in registerValidSW!')
  navigator.serviceWorker
    .register(swUrl)
    .then((registration) => {
      console.log(registration)
      registration.onupdatefound = () => {
        const installingWorker = registration.installing //This returns null
        if (installingWorker) {
          console.log('installingServiceWorker!!!')
          installingWorker.onstatechange = () => {
            if (installingWorker.state === 'installed') {
              if (navigator.serviceWorker.controller) {
                // At this point, the old content will have been purged and
                // the fresh content will have been added to the cache.
                // It's the perfect time to display a 'New content is
                // available; please refresh.' message in your web app.
                console.log('New content is available; please refresh.')
              } else {
                // At this point, everything has been precached.
                // It's the perfect time to display a
                // 'Content is cached for offline use.' message.
                console.log('Content is cached for offline use.')
              }
            }
          }
        }
      }
    })
    .catch((error) => {
      console.error('Error during service worker registration:', error)
    })

Svar #1

@krish enligt ny dokumentation-> Tjänstearbetaren är endast aktiverad i produktionsmiljön, t.ex. resultatet av npm run build. Det rekommenderas att du inte aktiverar en offline-först-tjänstearbetare i en utvecklingsmiljö, eftersom det kan leda till frustration när tidigare cachade resurser används och inte inkluderar de senaste ändringarna du gjort lokalt. Se denna länk :- https://create-react-app.dev/docs/making-a-progressive-web-app/

Relaterade artiklar