Set index.html and all other assets no cache headers

Support
1

Hello im curious how can i implement this kind of config using netlify toml file

"hosting": {
    "headers": [
      {
        "source": "/**",
        "headers": [
          {
            "key": "Cache-Control",
            "value": "no-cache, no-store, must-revalidate"
          }
        ]
      },
      {
        "source": "**/*.@(jpg|jpeg|gif|png|svg|webp|js|css|eot|otf|ttf|ttc|woff|woff2|font.css)",
        "headers": [
          {
            "key": "Cache-Control",
            "value": "max-age=604800"
          }
        ]
      }
    ]
  }

It should be something like this for the index.html file ( root file ) for my SPA application but don’t know how to write it for everything else

Something like this will work ?

[[headers]]
  for = "/index.html"
  [headers.values]
  cache-control = '''
  max-age=0,
  no-cache,
  no-store,
  must-revalidate'''
[[headers]]
  for = "/*.@(jpg|jpeg|gif|png|svg|webp|js|css|eot|otf|ttf|ttc|woff|woff2|font.css)"
  [headers.values]
  max-age=604800

Also i have _redirects file like so, and not sure if it will conflict with the headers.toml in some way

/* /index.html 200

2

Make sure you ready this before you modify caching headers:

netlify.toml does not support the syntax you’ve shared. You’d have to add a separate header for each extension.

3

Ok I have read the article ill add headers only for my index.html and service worker. I did that because I want other assets to be served with default headers as they are.

Currently this is my netlify related config but its still not working for all assets including index.html i see this in all asset headers.

cache-control: public, max-age=0, must-revalidate

Also playground
https://play.netlify.com/headers
for some reason never validates bad/good .toml files

_redirects

/* /index.html 200

_headers

/index.html
  cache-control: max-age=0
  cache-control: no-cache
  cache-control: no-store
  cache-control: must-revalidate
/service-worker.js
  cache-control: max-age=0
  cache-control: no-cache
  cache-control: no-store
  cache-control: must-revalidate

Also when in Deployment summary after I trigger deploy with clear cache and deploy option I see
2 header rules processed which means my syntax is fine.

4

What site are you trying that on?

Also, since you’re using a service worker, I don’t see why you’re trying to modify the caching headers. Service workers will cache anything you ask them to, much more reliably than the cache headers.

5

Because i deleted the service-worker converted PWA to normal SPA and now users with service-worker are stucked forever in the PWA version instead of the deployed SPA version

unbo is the website

6

Unfortunately, there’s nothing much you can do to solve it right now, at least no way I’m aware of. Any changes that you make to your site (including the headers that you’re attempting), would make no difference unless a user manually clears the service worker cache.

You can create a new service worker and redirect users there (or send them a link), so that service worker can take over the previous one and delete the cache.