Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

How to correctly use of precacheAndRoute to serve index.html ? (how to precache current html?) #3337

Open
eret9616 opened this issue Jul 3, 2024 · 0 comments

Comments

@eret9616
Copy link

eret9616 commented Jul 3, 2024

Library Affected:
workbox-sw, workbox-build

Browser & Platform:
"all browsers"

Issue or Feature Request Description:
My website is a single-page application, and Nginx uses try_files to return index.html for various routes. I've pre-cached index.html using Workbox. However, I've noticed that when I first visit a route, there is an initial document request, and then the service worker also makes another fetch request for index.html. These are two different requests with different durations,

and the service worker's fetch looks does not use the cache from the initial document request.( because i see the waterfall timeline in chrome devtool)

Is this expected behavior? How can I fix this issue so that only one request is necessary?

nginx.conf:

     location / {
            try_files $uri /index.html;
            add_header Cache-Control "no-cache,max-age=0";

workbox-config.js

module.exports = {
  globDirectory: 'dist',
  globPatterns: [
    'index.html',
...],
/ ...
}

service-worker.js:

...
precacheAndRoute(self.__WB_MANIFEST || [])
...
registerRoute(
  ({ request }) => {
    if (request.destination === 'document') {
        ...
        return true
      }
    }
    return false
  },
  async ({ request }) => {
    const response = await matchPrecache(`/index.html`)
    if (response) {
      return response
    } else {
      return fetch(request)
    }
  }
)
...
@eret9616 eret9616 changed the title How to correctly use of precacheAndRoute to serve index.html? How to correctly use of precacheAndRoute to serve index.html ? (how to precache current html?) Jul 19, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant