Next.js App Router 数据获取模式与缓存协作（2025）

# Next.js App Router 数据获取模式与缓存协作（2025） ## 一、模式与职责 - Server Components：在服务端拉取数据，减少客户端负担（Server Components）。 - Route Handlers：对接 API 路由与边缘；统一鉴权与缓存。 ## 二、fetch 与缓存 - fetch：设置 `cache: force-cache/no-store/revalidate`；按场景选择。 - revalidate：按页面/段落设置 `revalidate`；对动态路径精准刷新（revalidate）。 ## 三、预取与一致性 - 预取：对热门页面进行预取；控制频率与窗口。 - 一致性：写后触发失效与刷新；与 ISR/边缘缓存协作。 ## 四、观测与安全 - 指标：LCP/TTFB、命中率、错误率；形成仪表盘。 - 安全：最小权限与密钥治理；输入校验。 ## 注意事项 - 关键词（App Router、fetch、缓存、revalidate、Server Components）与正文一致。 - 分类为“前端/Next.js/数据”，不超过三级。 - 参数需在真实流量与性能基线上验证。