Problem hosting React application with PWA on Netlify

Support
1

I have a problem that only occurs in the application hosted on netlify, basically I have a website in ReactJs and there was a need to add PWA so that the application could work offline.

Everything works normally online, but when I install the site and try to open it offline, this error occurs even though everything necessary for it to work offline is correctly stored in the cache. (this error does not happen online or offline when installing the application via localhost. only on netlify)

image
image1306×990 40.4 KB

Has anyone had a similar problem and know how to fix it?

how to reproduce the error:

  1. Access the website https://computacaoplugadaordenacao.netlify.app/ with an active internet connection

2.Click install in the browser

3 Try opening the application without an internet connection

repository: GitHub - Marcos-Vinicius9/sorting-plugged-computing-web: Versão Web do aplicativo Computação Plugada Ordenação.

2

You’ve hard-coded the assets in your code: sorting-plugged-computing-web/public/serviceWorker.js at main · Marcos-Vinicius9/sorting-plugged-computing-web (github.com)

However, when the site is built, the names of the files change. For example, your current file is:

/static/js/main.f332a08d.js

as you can see, you’ve not added that to your service worker. So it doesn’t have that in the cache and load some HTML page insted of the JavaScript asset.

This has nothing to do with Netlify, instead it depends on the way you’ve generated the service worker.