hanford / next-offline

make your Next.js application work offline using service workers via Google's workbox
https://github.com/hanford/next-offline
1.59k stars 113 forks source link

With StaleWhileRevalidate strategy it doesn't make the second call to update the Service Worker #271

Closed davidpaley closed 3 years ago

davidpaley commented 3 years ago

Browser & Platform: "all browsers".

Issue or Feature Request Description: Hi! I am working with this site, and I set this configuration:

workboxOpts: {
                  swDest: '../public/service-worker.js',
                  maximumFileSizeToCacheInBytes: 20000000,
                  runtimeCaching: [
                    {
                      urlPattern: /https:\/\/fonts\.googleapis\.com\/icon[\w\-_\/\.\:\?\=\&\+]*/,
                      handler: 'CacheFirst',
                      options: {
                        cacheName: 'google-fonts',
                        expiration: {
                          maxEntries: 10,
                          maxAgeSeconds: 30 * 24 * 60 * 60, // 1 month
                        },
                      },
                    },
                    {
                      urlPattern: /^((?!tracker).)*\.(jpeg|png|jpg|ico|svg)\??.*/,
                      handler: 'CacheFirst',
                      options: {
                        cacheName: 'img-cache',
                        expiration: {
                          maxEntries: 15,
                          maxAgeSeconds: 2 * 24 * 60 * 60, // 2 days
                        },
                      },
                    },
                    {
                      urlPattern: /https:\/\/embed.widencdn.net\/img\/cityfurniture.*.(jpeg|png|jpg)\?.*/,
                      handler: 'StaleWhileRevalidate',
                    },
                    {
                      urlPattern: /https:\/\/auth-cityfurniture.dotcmscloud.com\/(dA|contentAsset\/image)[\w\-_\/\.\:\?\=\&\+]*/,
                      handler: 'StaleWhileRevalidate',
                    },
                    {
                      urlPattern: /^((?!monetate).)*\.(js)$/,
                      handler: 'StaleWhileRevalidate',
                    },
                  ],
                },

As the js files are configured with the strategy Stale While Revalidate, when I went to the network tab in the Developers tools I was hoping to see two requests for the files cached in the Service Worker (SW), one for the SW request and one for the update of the data on the SW. But I am seeing just one request for the SW JS files. Am I understanding this wrong? It should do another call to revalidate the content of the SW, right?

image

davidpaley commented 3 years ago

I could resolve this here https://github.com/GoogleChrome/workbox/issues/2767