Custom Cache-Control headers with App Router

[matthias-luger]

Goals

1. Allow to set a custom Cache-Control header with the App Router

Non-Goals

No response

Background

Background

While moving my getServerSideProps functions from the old Pages folder to the App Router solution, I noticed that it's not possible to set a custom Cache-Control header, as we dont't have access to the Http Response object (res) anymore.

I tried using the newly available caching functionalities, but was unable to find a fitting solution for my use case.

Use case:

I have dynamic pages with changing data (let's say around every 5min). I want these pages to be cached for these estimated 5 minutes. After this time, the page should execute a new fetch and respond with the new data.

I can't use revalidate = 300, as the first user that requests the page after the revalidate time runs out, still gets served the outdated data. So if a page is not visited for a longer time, the first user receives outdated data. The data served to the users should at most be 5 minues old.

Old solution:

In the old getServerSideProps, I set these Cache-Control headers:
res.setHeader('Cache-Control', 'public, max-age=300, s-maxage=200')

Proposal

I would imagine the solution to be a property in the NextFetchRequestConfig like cacheControl.
I am interested in trying to contribute to this feature.

[leerob]

It's now possible to customize cache-control as of v14.2.10. Please upgrade and give it a try!

#69802