shadowwalker / next-pwa

Zero config PWA plugin for Next.js, with workbox 🧰
MIT License
3.75k stars 311 forks source link

My cache is deleted on refresh and nothing is served when offline #416

Closed skellertor closed 1 year ago

skellertor commented 1 year ago

Summary

When my app goes offline, and I try to refresh the browser, the cache is emptied and I get a error message saying "You are not connected to the internet" when I think it should be showing the cached page.

Versions

How To Reproduce

Steps to reproduce the behavior:

  1. Go to https://app.dev.nerdunited.net/login
  2. Open the developer tools
  3. Go to the Application tab and navigate to the Cache. Ensure that it has pages cached
  4. Go to the Network tab and change it to offline to mimic no internet connection
  5. Refresh the page
  6. The "not connected to the internet" browser message shows up instead of my cached page

Link to minimal reproduce setup repository if any.

Expected Behaviors

I expect it to go to the network first, if its not there, fallback to the cache and serve the cached page

Screenshots

If applicable, add screenshots to help explain your problem.

Context

Here is my nextconfig.js

const withPWA = require('next-pwa')({
  dest: 'public',
  register: true,
  skipWaiting: true,
  disable: process.env.NODE_ENV === 'development',
  runtimeCaching: [
    {
      urlPattern: ({ url }) => {
        const isSameOrigin = self.origin === url.origin;
        if (!isSameOrigin) return false;
        const pathname = url.pathname;

        if (pathname.includes('/api/auth/')) return false;
        // we don't want to cache api calls
        if (pathname.includes('/api/')) return true;
        return false;
      },
      handler: 'NetworkOnly',
      method: 'GET',
    },
  ],
});

module.exports = withPWA({
  reactStrictMode: true,
  productionBrowserSourceMaps: true,
  pageExtensions: ['page.jsx', 'page.js'],
});
skellertor commented 1 year ago

I found some chrome related issues around this. It turns out it only erases the cache when dev tools are open. If I refresh when I am offline, and the developer tools are closed, it behaves as it should

skellertor commented 1 year ago

Here is the bug I referenced above https://github.com/shadowwalker/next-pwa/issues/177