Service Worker Fetch Error When Trying to Load --- My Website?
I've recently added Cloudfront to my web app. I'm using a WorkBox service worker and getting the error:
VM7 workbox-strategies.prod.js:1 Uncaught (in promise) TypeError: Failed to fetch
I found out from this SO post to watch the Network tab to find out what resource was causing the problem.
I checked and found out -- it's trying to load my own domain!
The domain loads in the browser just fine. Why would the service worker be throwing this fetch error?
What you're seeing is due to the new offline support detection in Chrome 89+.
If your site has a web app manifest and a service worker, Chrome will automatically simulate an offline connection and then make a request for the start_url listed in your web app manifest.
If your service worker uses a network-first strategy for responding to navigation requests, then there may be a failed network request logged in the Network panel, even if the check ultimately succeeds because of a response from the cache.
(The Chrome DevTools team is aware that this can be a bit confusing, and is working on improving how this is reported to developers.)