+headersResponse

type Value =
| Record<string, string>
| [string, string][]
// The standard Headers interface
| Headers
type HeadersResponse =
| Value
| ((pageContext: PageContextServer) => Value | Promise<Value>)

vike
You can modify the HTTP response headers by using +headersResponse
and/or pageContext.headersResponse
.
⚠️Both+headersResponse
andpageContext.headersResponse
are beta features: expect breaking changes in any minor version update. See #2554 - Stabilize+headersResponse
andpageContext.headersResponse
.
// pages/+config.ts
import type { Config } from 'vike/types'
// Statically adding header
export default {
headersResponse: {
'X-Powered-By': 'my-vike-app'
}
} satisfies Config
You can add headers dynamically:
// pages/+headersResponse.ts
import type { PageContextServer } from 'vike/types'
export async function headersResponse(pageContext: PageContextServer) {
return {
'some-dynamic-header': `the-page-url=${pageContext.urlPathname}`
}
}
You can modify and remove headers:
// Dynamically adding/modifying header
pageContext.headersResponse.set('Set-Cookie', 'sessionId=abc123')
// Dynamically removing header
pageContext.headersResponse.delete('X-Powered-By')
pageContext.headersResponse
is a standardHeaders
object.
You can access
pageContext
in any Vike hook and UI component — see API >pageContext
.
The final HTTP response headers sent to the client are available at pageContext.httpResponse.headers
.
import { renderPage } from 'vike/server'
// Server middleware
app.get('*', async (req: Request) => {
// ...
const pageContext = await renderPage(pageContextInit)
// HTTP response headers sent to the client
const headers = pageContext.httpResponse.headers
// ...
})
See: API >
renderPage()
It's a list of string tuples [string, string][]
— for example:
[
['Content-Type', 'text/html;charset=utf-8'],
['Cache-Control', 'no-store, max-age=0']
]
You can convert it to a standard Headers
object by using new Headers()
:
const headers = new Headers(pageContext.httpResponse.headers)