mirror of
https://github.com/hanzoai/next.js.git
synced 2026-09-24 17:00:51 +00:00
101 lines
2.4 KiB
JavaScript
101 lines
2.4 KiB
JavaScript
import { updateTag } from 'next/cache'
|
|
|
|
export const fetchCache = 'default-cache'
|
|
|
|
async function AnotherRsc() {
|
|
const data = await fetch(
|
|
'https://next-data-api-endpoint.vercel.app/api/random?another-no-cache',
|
|
{
|
|
cache: 'no-cache',
|
|
}
|
|
).then((res) => res.text())
|
|
|
|
return <p id="another-no-cache">"another-no-cache" {data}</p>
|
|
}
|
|
|
|
async function FirstRsc() {
|
|
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',
|
|
{ next: { tags: ['test-tag'] } }
|
|
).then((res) => res.text())
|
|
|
|
return (
|
|
<>
|
|
<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>
|
|
</>
|
|
)
|
|
}
|
|
|
|
function RevalidateForm() {
|
|
return (
|
|
<form
|
|
action={async () => {
|
|
'use server'
|
|
updateTag('test-tag')
|
|
}}
|
|
>
|
|
<button id="revalidate-button">Revalidate</button>
|
|
</form>
|
|
)
|
|
}
|
|
|
|
export default async function Page() {
|
|
return (
|
|
<>
|
|
<h1>Default Cache</h1>
|
|
<FirstRsc />
|
|
<AnotherRsc />
|
|
<RevalidateForm />
|
|
</>
|
|
)
|
|
}
|