headers (next.config)
Adds custom HTTP response headers to matching paths.
Syntax
async headers() { return [{ source, headers: [{ key, value }] }] } Parameters
| Name | Type | Required | Description |
|---|---|---|---|
headers | () => Promise<Header[]> | No | Rules with `source` and a list of `{ key, value }` headers. |
Returns
Promise<Header[]> — Response header rules applied per path.
Examples
const nextConfig = {
async headers() {
return [
{
source: '/:path*',
headers: [
{ key: 'X-Frame-Options', value: 'DENY' },
{
key: 'Strict-Transport-Security',
value: 'max-age=63072000; includeSubDomains; preload',
},
],
},
]
},
}
module.exports = nextConfig
const nextConfig = {
async headers() {
return [
{
source: '/static/:path*',
headers: [
{
key: 'Cache-Control',
value: 'public, max-age=31536000, immutable',
},
],
},
]
},
}
module.exports = nextConfig
Notes
Useful for global security headers (CSP, HSTS, X-Frame-Options) and
caching policy. `source` supports path params/wildcards and
`has`/`missing` conditions. For per-request dynamic headers use
`middleware.js` or set them in Route Handlers/`NextResponse`.