Firebase hosting: how to prevent caching for index.html SPA

Question

I host SPA on firebase, where almost all paths correspond to index.html. I use hash-based cache flushing, so I want to always prevent my index.htmlbut not any other files from being cached . It is surprisingly difficult for me to do this. In particular, my file looks like this

/
├── index.html
├── login.html
├── js
│   ├── login.ba22ef2579d744b26c65.bundle.js
│   └── main.6d0ef60e45ae7a11063c.bundle.js
└── public
    └── favicon-16x16.ico

I started naively with "sources": "index.html"before reading this quote from the documentation.

Each definition must have a source key that maps to the original request path, regardless of any rewrite rules using glob notation .

So, instead of a simple globe that indicates the files for which I want these headers, I think I need one along the paths. Since most paths are redirected to index.html, I need a globe that excludes all paths that I do not want to put these headers on.

For reference, my hosting section firebase.jsonlooks like this:

{
  "hosting": {
    "public": "dist",
    "rewrites": [
      {
        "source": "**",
        "destination": "/index.html"
      }
    ],
    "cleanUrls": true,
    "trailingSlash": false,
    "headers": [
      {
        "source": <<<WHAT-GOES-HERE?>>>,
        "headers": [
          {
            "key": "Cache-Control",
            "value": "no-cache, no-store, must-revalidate"
          },
          {
            "key": "Pragma",
            "value": "no-cache"
          },
          {
            "key": "Expires",
            "value": "0"
          }
        ]
      }
    ]
  }
}

So, here are a few examples that redirect to index.html and should not be cached.

mysite.com  
mysite.com/  
mysite.com/foo/bar/baz  
mysite.com/index.html 

Note: I could live if this last one was cached, as it is not used in practice.

And things that do not redirect to index.html and should not be cached

**/*.* (ideally excluding index.html)
mysite.com/login  

, , **/!(login|*.*) mysite.com , mysite.com mysite.com/. 2 , , .

Answer 1

, . , , images, css, js .. , , "source": "/**" no-cache. , , example.com, example.com/index.html, example.com/about-us, example.com/about-us.html, .

{
  "hosting": {
    "public": "dist",
    "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"
          }
        ]
      }
    ],
    "ignore": ["firebase.json", "**/.*", "**/node_modules/**"]
  }
}

Answer 2

Medium , . . (... , :)).