Q36: How do you attach custom HTTP response headers to pages in the Pages Router?
Custom response headers can be set globally in next.config.js via the headers() async function, or per-request inside getServerSideProps using context.res.setHeader('Header-Name', 'Value').
Setting Headers in getServerSideProps
export async function getServerSideProps({ res }) {
res.setHeader('Cache-Control', 'public, s-maxage=10, stale-while-revalidate=59');
return { props: { time: new Date().toISOString() } };
}💡 Sets custom HTTP Cache-Control headers directly on the Node.js response object.
Key Takeaways
- Global headers: Configure
headers()innext.config.js. - Dynamic headers: Call
context.res.setHeader()ingetServerSideProps.
Knowledge Check
Can you call context.res.setHeader() inside getStaticProps?