public directory no cache-control

[duanchunjiao]

Summary

Next.js does not automatically set cache headers for files in the public directory. You must configure the cache headers yourself at the server or CDN level.

You can use this sentence to ask for official confirmation.

Really? Because files in the public directory are not cached by the CDN unless I manually set the cache headers on the server or CDN. Is that correct?

Additional information

No response

Example

No response

[yassine-krichen]

Yeah, the statement is correct. Next.js does not automatically apply any cache headers to files in /public. Those files are basically treated like raw static assets, and unless your hosting layer (Vercel, Cloudflare, Nginx, whatever) adds caching rules, they’ll just be served with default “no-cache or minimal” behavior.

So yes, if you don’t set Cache-Control yourself, your CDN won’t cache them.
There’s nothing in Next.js that magically turns /public into long-lived cached assets.

On Vercel, caching works because Vercel adds the headers for you.
On any other setup, it’s on you.

[engripaye]

---

Really? Just to confirm — files inside the /public directory in Next.js are not automatically cached by the CDN or the framework. They are only cached if I manually configure cache headers at the server level (e.g., Vercel headers, Nginx, Cloudflare). Is that correct?

---

[engripaye]

Really? Just to confirm — files inside the /public directory in Next.js are not automatically cached by the CDN or the framework. They are only cached if I manually configure cache headers at the server level (e.g., Vercel headers, Nginx, Cloudflare). Is that correct?

[Umuts-Codes]

You are correct — Next.js does not automatically set cache headers for files in the public directory. By default, these files are served as-is, without explicit cache control headers.

How to handle caching:

1. Using Vercel
   You can configure cache headers in your vercel.json file. Example:

{
  "headers": [
    {
      "source": "/(.*)",
      "headers": [
        { "key": "Cache-Control", "value": "public, max-age=31536000, immutable" }
      ]
    }
  ]
}

This will tell the CDN and browser to cache the files for 1 year.

2. Using your own server (Node.js, Express, etc.):

   When serving static files, set the Cache-Control header:

app.use(express.static('public', {
  setHeaders: (res, path) => {
    res.set('Cache-Control', 'public, max-age=31536000, immutable');
  }
}));

✅ Summary

• Next.js does not automatically set cache headers for public/ files.
• You need to configure headers yourself at the server or CDN level.
• Proper cache headers improve performance and reduce bandwidth usage.

This approach ensures that both browsers and CDNs handle caching correctly.

[fortuneguy97]

✔ If you deploy to Vercel

Vercel automatically applies CDN caching to /public assets with long-term immutable caching:

Cache-Control: public, max-age=31536000, immutable

So on Vercel, they ARE cached automatically, even though Next.js does not set these headers directly.

✔ If you self-host (Node.js server, Docker, Nginx, etc.)

Then you must manually set cache headers, because Next.js does NOT do it for you.

So the real answer is:

Next.js alone → no automatic cache headers

Vercel → adds CDN caching automatically

Self-hosting → must configure caching yourself