Response headers using static.json and React Router

[dcporter44]

I am trying to set a header in static.json on ONLY my index.html file using:

headers: { "/": { "Cache-Control": "no-store" } }

The header works successfully when I specifically go to "https://mywebsite.com/" But if I go to "https://mywebsite.com/sign-in", the header is not there. This is because /sign-in is not an actual file in my project. It is a route generated by React router.

I know I can use "/**" instead of "/" in static.json, but I don't want to add this header to my .css, .js, fonts etc.

Is there functionality available in static.json to apply headers to only the HTML file, no matter the route?

[dcporter44]

Here is the entrity of my static.json file for reference:

{
  "root": "build/",
  "routes": {
    "/**": "index.html"
  },
  "https_only": true,
  "headers": {
    "/**": {
      "Strict-Transport-Security": "max-age=31557600",
      "X-Frame-Options": "SAMEORIGIN",
      "X-Content-Type-Options": "nosniff",
      "X-XSS-Protection": "1; mode=block"
    },
    "/": {
      "Cache-Control": "no-store"
    }
  }
}

[aautem]

You can add additional rules to override your default.

{
  "root": "public/",
  "headers": {
    "/**": {
      "Cache-Control": "public, max-age=0, must-revalidate"
    },
    "/**.css": {
      "Cache-Control": "public, max-age=31536000, immutable"
    },
    "/**.js": {
      "Cache-Control": "public, max-age=31536000, immutable"
    },
    "/static/**": {
      "Cache-Control": "public, max-age=31536000, immutable"
    },
    "/icons/*.png": {
      "Cache-Control": "public, max-age=31536000, immutable"
    }
  },
  "https_only": true,
  "error_page": "404.html"
}