前端 - nextjs默认情况下到底缓存不缓存 fetch的响应?

Question

https://nextjs.org/docs/app/building-your-application/data-fe...

---

https://nextjs.org/docs/app/building-your-application/caching

Answer 1

截图的两处应该是对应 Data Cache 和 Request Memoization 的两处缓存。
Request Memoization 是针对一个用户多次相同请求的缓存,这个请求在 React 组件树完成渲染后会自动删除,如果在组件树中多次发起相同的请求,也是请求同一份数据。
Data Cache 是针对不同的用户的相同请求产生的缓存,这个缓存支持 Revalidating 特性,应该在缓存层次上比 Request Memoization 高一层。
我猜测是 Request Memoization 是强制性的, Data Cache 可以通过 fetch 的 cache 配置进行修改。
除了这两个外,往外还有两层缓存,Full Route Cache 和 Router Cache
Data Cache 在以下的情况下会选择退出(这是 next 14 时写的笔记,不知道 15 是否有变动)

  * Server Action 中使用

  * Route Handler 中使用了 POST 请求。

  * 设置 { cache: 'no-store' }

  * 设置 next.revalidate = 0 或者是对应的 Route Segment Config options。

  * 使用 Route Segment Config options 并且设置 const dynamic = 'force-dynamic',这样会对 route segment 内的所有请求,包括第三方库的请求造成影响。

Answer 2

在 Next.js 15 版本之前，fetch 的默认缓存策略是 cache: 'force-cache'。在这些版本中，fetch 请求会默认缓存响应。
从 Next.js 15 版本开始，默认的缓存策略改为 cache: 'no-store'，默认情况下不会缓存 fetch 的响应，但是仍然可以通过显式设置 cache 选项来缓存响应。