Cloudflare
Caching

Caching

@opennextjs/cloudflare supports caching (opens in a new tab) and revalidating (opens in a new tab) data returned by subrequests you make in your app by calling fetch() (opens in a new tab).

By default, all fetch() subrequests made in your Next.js app are cached. Refer to the Next.js documentation (opens in a new tab) for information about how to disable caching for an individual subrequest, or for an entire route.

The cache persists across deployments (opens in a new tab). You are responsible for revalidating/purging this cache.

💡

Workers KV is eventually consistent, which means that it can take up to 60 seconds for updates to be reflected globally, when using the default TTL of 60 seconds.

How to enable caching

opennextjs/cloudflare uses Workers KV (opens in a new tab) as the cache for your Next.js app. Workers KV is fast (opens in a new tab) and uses Cloudflare's Tiered Cache (opens in a new tab) to increase cache hit rates. When you write cached data to Workers KV, you write to storage that can be read by any Cloudflare location. This means your app can fetch data, cache it in KV, and then subsequent requests anywhere around the world can read from this cache.

To enable caching, you must:

1. Create a KV namespace

npx wrangler@latest kv namespace create NEXT_CACHE_WORKERS_KV

2. Add the KV namespace to your Worker

[[kv_namespaces]]
binding = "NEXT_CACHE_WORKERS_KV"
id = "<YOUR_NAMESPACE_ID>"

3. Set the name of the binding to NEXT_CACHE_WORKERS_KV

As shown above, the name of the binding that you configure for the KV namespace must be set to NEXT_CACHE_WORKERS_KV.