Service Workers... aren't working

#help

Well, I know there are articles all over the internet that talk about service workers. However, I'm stuck.

I'm trying cache a few files for offline use, for a small game I'm working on, which I would've thought would be relatively simple. Previous versions of it used <html manifest="cache.manifest"> to cache the files necessary, and I had planned to do the same once again... until I did a bit of research, and found it was deprecated.

Service workers are, apparently, the recommended replacement for the appcache. For some reason, I can't get them working, though. I've tried following the instructions for making a web-app work offline with service workers off the MDN web docs, but I keep getting Uncaught (in promise) TypeError: Request failed in the console.

Help would be much appreciated.

View the game @ https://car-cricket.glitch.me
View the source code @ https://glitch.com/edit/#!/car-cricket

Top comments (4)

Usama Ashraf • May 5 '18

assets/cricket.png doesn't seem to valid since I'm getting a 404 on hitting car-cricket.glitch.me/assets/crick....

It's good to catch these kinds of errors too:

cache.addAll(cacheFiles)
     .then(() => console.log('Assets added to cache'))
     .catch(err => console.log('Error while fetching assets', err));

Also, addAll won't cache any of the specified assets if even one request fails.

dragonwocky • May 5 '18

Ah, thanks. That's fixed the error, but I still can't access the site offline. On mobile, it just shows the "no internet" page, and on computer I either get no errors or I get An unknown error occurred when fetching the script. Failed to load resource: net::ERR_INTERNET_DISCONNECTED

Usama Ashraf • May 5 '18

See if this helps.

Mehdi M. • May 5 '18 • Edited

There’s just no car-cricket.glitch.me/assets/crick... (look in car-cricket.glitch.me/assets), that’s why the Service Worker can’t cache it.

However, this file URL is cdn.glitch.com/6cc9893d-2247-43b3-..., so even with the fixed URL, it won’t be cached because Service Worker can’t cache external resources, if I’m correct.

DEV Community

Service Workers... aren't working

Top comments (4)

Read next

GBASE数据库 | GBase 8c Compatibility Analysis with Distributed Databases

Dynamic HTML Tag in React Components with the "as" prop

Angular or React: Which is better for your project in 2024?

🎙️ My AI-Generated Podcast with NotebookLM