Troubles setting cache headers

[stramel]

I'm trying to add some cache-control headers for my CRA files but I don't see the header coming through. Following this documenation: https://facebook.github.io/create-react-app/docs/production-build#static-file-caching

serve.json

{
  "public": "build",
  "rewrites": [
    {
      "source": "**",
      "destination": "/index.html"
    }
  ],
  "headers": [
    {
      "source": "static/**/*",
      "headers": [
        {
          "key": "Cache-Control",
          "value": "max-age=31536000, immutable"
        }
      ]
    },
    {
      "source": "precache-manifest.*.js",
      "headers": [
        {
          "key": "Cache-Control",
          "value": "max-age=31536000, immutable"
        }
      ]
    },
    {
      "source": "service-worker.js",
      "headers": [
        {
          "key": "Cache-Control",
          "value": "null"
        }
      ]
    },
    {
      "source": "*",
      "headers": [
        {
          "key": "Cache-Control",
          "value": "no-cache"
        }
      ]
    }
  ]
}

I am using the command, serve -l 3000 to serve my config and build/ folder.

To check for the caching header I have checked in Chrome DevTools and using this curl command. curl -sD - -o /dev/null http://localhost:3000/static/media/[email protected]

[mikabytes]

I also have this problem. Did you have any luck finding a way around it @stramel ?

[stramel]

@mikabytes Unfortunately, I didn't find a workaround. I ended up switching to using nginx to host it.

[mikabytes]

Alright. I will do that as well. Thanks for letting me know.

[mlp73]

Same issue here

[salazarm]

Same issue, probably an issue for server-handler?

[dkoleary88]

Same issue. Anyone found a solution for this?

[UsamaAshraf82]

I have done The Cache Control using

{
  "rewrites": [{ "source": "/**", "destination": "index.html" }],
  "headers": [
    {
      "source": "!**/static/**",
      "headers": [
        {
          "key": "Cache-Control",
          "value": "no-cache"
        }
      ]
    },
    {
      "source": "**/static/**",
      "headers": [
        {
          "key": "Cache-Control",
          "value": "public, max-age=31536000, immutable "
        }
      ]
    }
  ]
}

[PatrikElfstrom]

Don't know if you had the same issue but i missed that Serve looks in the ./build directory for the ./serve.json config. So if your config (like mine) is in the project root then you will also need to specify that path: serve -s build --config ../serve.json

[damianobarbati]

@mikabytes @stramel make sure as @PatrikElfstrom said to give the correct path to the serve.json: I had the same problem, it was because no serve.json file was used.

And one thing is important: the syntax to use extensions is with @, using paranthesis without the @ breaks the path matching!

{
  "directoryListing": false,
  "headers": [
    {
      "source" : "*.html",
      "headers" : [{
        "key" : "Cache-Control",
        "value" : "no-store"
      }]
    },
    {
      "source" : "**/*.@(js|json|css|map|png|jpg|jpeg|gif|svg|ico|txt|woff|woff2)",
      "headers" : [{
        "key" : "Cache-Control",
        "value" : "max-age=86400"
      }]
    }
  ]
}

@leo would you consider adding a warning/log if serve is running without any serve.json detected? This would help a lot solving problems like this, the developer would spot it quickly.