如何在 App Router 中通过 fetch 配置缓存策略（如 force-cache, no-store）来实现 SSG 或 SSR？

Question

Accepted Answer

在 Next.js App Router 中，Next.js 扩展了原生的 Web API。你可以通过在 函数的第二个参数中设置 或 选项，来精确控制数据的缓存行为，从而实现 SSG（静态站点生成）、SSR（服务端渲染）或 ISR（增量静态再生）。 以下是具体的配置方法： 1. 实现 SSG (Static Site Generation) - 默认行为 SSG 意味着数据在 构建时 (Build Time) 获取，生成的 HTML 被缓存并在用户访问时复用。 配置策略： (默认) 适用场景： 博客文章、文档、营销页面等内容不经常变动的数据。 2. 实现 SSR (Server-Side Rendering) SSR 意味着数据在 每次请求时 (Request Time) 重新获取，HTML 是在服务器上为每个用户实时生成的。 配置策略： 适用场景： 实时股票数据、用户个性化仪表盘、经常变化的数据。 3. 实现 ISR (Incremental Static Regeneration) ISR 是 SSG 和 SSR 的混合体。页面在构建时生成，但在经过指定的时间（秒）后，如果有...