HTTP Headers
Request
You can access the headers of the HTTP request at:
pageContext.headers
pageContext.headersOriginal
pageContext.headers
is a string object (Record<string, string>
) normalized by Vike, and pageContext.headersOriginal
is the original object (unknown
) provided by your server.
For example:
// pageContext.headers
{
'accept-encoding': 'gzip, br',
'accept-language': 'en-US,en;q=0.9,fr;q=0.8',
'cache-control': 'max-age=0',
connection: 'Keep-Alive',
cookie: 'username=brillout; admin=true'
}
// pageContext.headersOriginal
[
['Accept-Encoding', 'gzip, br'],
['Accept-Language', 'en-US,en;q=0.9,fr;q=0.8']
['Cache-Control', 'max-age=0'],
['Connection', 'Keep-Alive'],
['Cookie', 'username=brillout; admin=true']
]
You can convert it to a standard Headers
object by using new Headers()
:
const headers = new Headers(pageContext.headers)
All values are merged. You can get the list of values as an array (string[]
):
const acceptLanguage = pageContext.headers['accept-language']
.split(',')
.map(v => v.trimStart())
For getting the list of cookie values, you can use a cookie parser (e.g. cookie-parser
).
The pageContext.headersOriginal
value is defined at the renderPage()
integration:
import { renderPage } from 'vike/server'
app.get('*', async (req) => {
const pageContextInit = {
urlOriginal: req.url,
// Defined here
headersOriginal: req.headers
}
const pageContext = await renderPage(pageContextInit)
// ...
})
Response
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.js
// Statically adding header
export default {
headersResponse: {
'X-Powered-By': 'my-vike-app'
}
}
// 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) => {
// ...
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)