Files
Zack Tanner afa9f96515 add a "skip" cache type to verbose logging mode (#53275)
When verbose logging is enabled and a cache MISS is logged due to either `revalidate: 0`,`cache: no-store` or `cache-control: no-store`, this logs a slightly different message, ie:

```
- GET / 200 in 804ms
   ├─── GET <url> in 205ms (cache: SKIP, reason: cache: no-cache)
   ├────── GET <url> 200 in 0ms (cache: HIT)
   ├────── GET <url> 200 in 373ms (cache: SKIP, reason: revalidate: 0)
   └────── GET <url> 200 in 111ms (cache: SKIP, reason: cache-control: no-cache (hard refresh))
 ```
 
 Closes NEXT-1412
2023-07-28 20:01:31 +00:00

64 lines
1.7 KiB
JavaScript

export const fetchCache = 'default-cache'
export default async function Page() {
const dataNoCache = await fetch(
'https://next-data-api-endpoint.vercel.app/api/random?no-cache',
{
cache: 'no-cache',
}
).then((res) => res.text())
const dataForceCache = await fetch(
'https://next-data-api-endpoint.vercel.app/api/random?force-cache',
{
cache: 'force-cache',
}
).then((res) => res.text())
const dataRevalidate0 = await fetch(
'https://next-data-api-endpoint.vercel.app/api/random?revalidate-0',
{
next: {
revalidate: 0,
},
}
).then((res) => res.text())
const dataRevalidateCache = await fetch(
'https://next-data-api-endpoint.vercel.app/api/random?revalidate-3',
{
next: {
revalidate: 3,
},
}
).then((res) => res.text())
const dataRevalidateAndFetchCache = await fetch(
'https://next-data-api-endpoint.vercel.app/api/random?revalidate-3-force-cache',
{
next: {
revalidate: 3,
},
cache: 'force-cache',
}
).then((res) => res.text())
const dataAutoCache = await fetch(
'https://next-data-api-endpoint.vercel.app/api/random?auto-cache'
).then((res) => res.text())
return (
<>
<p>/force-cache</p>
<p id="data-no-cache">"cache: no-cache" {dataNoCache}</p>
<p id="data-force-cache">"cache: force-cache" {dataForceCache}</p>
<p id="data-revalidate-0">"revalidate: 0" {dataRevalidate0}</p>
<p id="data-revalidate-cache">"revalidate: 3" {dataRevalidateCache}</p>
<p id="data-revalidate-and-fetch-cache">
"revalidate: 3 and cache: force-cache" {dataRevalidateAndFetchCache}
</p>
<p id="data-auto-cache">"auto cache" {dataAutoCache}</p>
</>
)
}