时间戳

首页 > 解决方案 > 如何在 Next.js 中为带有后备的静态路由启用 ISR？

next.js - 如何在 Next.js 中为带有后备的静态路由启用 ISR？

问题描述

我知道启用带有后备功能的 ISR 需要getStaticPaths在页面中导出：

export const getStaticPaths = () => {
  return {
    paths: []
  , fallback: 'blocking'
  }
}

但是，getStaticPaths仅适用于动态路由，例如[slug].jsx.

我想为带有后备的静态路由启用 ISR index.jsx，这不可能吗？

附加信息：我无法在构建时预先生成页面。

标签： next.js

解决方案

fallback密钥用于getStaticPaths控制如何为动态路由处理未在构建时生成的新路径。它可以返回一个404页面 ( fallback: false)，或者允许 Next.js 生成新页面 (fallback: blocking或fallback: true)。

鉴于您index.jsx不是动态路由，这不适用，并且不需要后备，因为该页面将始终在构建时预先生成。

另一方面，增量静态重新生成允许您重新生成现有页面。它通过 中的revalidate属性启用getStaticProps，并且可以在动态和非动态路由中使用。

// index.jsx

export async function getStaticProps() {

    return {
        props: {
            //...
        }
        revalidate: 10 // Enables page regeneration
    }
}

当向 发出请求时index.jsx，它最初会显示缓存的预生成页面。

从文档：

  • 在初始请求之后和 10 秒之前对页面的任何请求也会被缓存并且是瞬时的。
  • 在 10 秒窗口之后，下一个请求仍将显示缓存（陈旧）页面。
  • Next.js 在后台触发页面的重新生成。
  • 成功生成页面后，Next.js 将使缓存失效并显示更新的产品页面。如果后台重新生成失败，旧页面将保持不变。

推荐阅读