CODEWITHSUNDEEP
service-workerworkbox
pate
pate

Reputation: 5253

Correct way to precache the root url ("/")

I'm a bit confused about the correct way to precache the root url, namely "/".

If I use webpack-plugin-workbox to generate the precacheManifest, it doesn't include an entry for "/". "/index.html" is included of course. Now if the user loads the app, precaching kicks in, and the user tries to load the root url without network connectivity, the site won't load since precaching did nothing for the root url. If the user tries to load "/index.html" everything works nicely. But users don't load that url, they load the root url. So how to cache that?

Should I use the navigateFallback: index.html option which, in my understanding, redirects the user to the provided url in case of connectivity loss and cache miss?

Or should I use templatedUrls: { "/": [ "index.html" ] } option which, in my understanding, generates a hash based on the index.html and then caches "/" based on the changing of that hash value?

Or should I use some completely different strategy?

Thanks a million!

Upvotes: 3

Views: 10341

Answers (1)

Jeff Posnick
Jeff Posnick

Reputation: 56044

By default, when there's an initial precache miss for a URL that ends in /, Workbox will check its list of precached files again to see if there's a match for the same URL ending in /index.html.

You can read more about this, along with how to customize the default behavior, in the module guide for workbox-precaching.

So... things should work as you describe without your needing to do anything. (You need to make sure that you're testing after the service worker has activated and takes control over the current window client.)

If you're not seeing that behavior, it sounds like there might be a bug in Workbox, and it might be best to follow up in the issue tracker with more details.

Upvotes: 4

Related Questions