Question

我根据构建时我的 CMS 中可用的内容为动态 slug 构建了所有初始路由。然后当新的 CMS 数据可用时，我会在用户请求时生成新页面。

我遇到了一个问题，用户可能会点击 /posts/1，但由于 posts/1 没有 CMS 数据，我正在使用 notFound 内部的布尔值呈现 404 页面getStaticProps。这是我期望发生的事情。

现在，如果我将一些数据发布到我的 CMS 中的 /posts/1，下次用户点击 /posts/1 时，API 数据将在 getStaticProps 方法中获取，然后页面开始建立。问题是即使未命中 notFound 块，用户也会立即重定向到 404 页面。由于页面正在构建，router.isFallback 标志在应该为真时也显示为假。现在，如果该用户刷新他们的页面，他们将看到生成的页面，而不再是现在构建的 404 页面。

在第二种情况下，似乎 Next 可能会将用户的请求路由到 404 页面，因为它以前是 404 页面，但是有什么方法可以“阻止”用户的请求或显示我的后备，直到页面呈现他们在页面构建时没有看到这个 404？如果第一个用户在 CMS 数据可用之前没有点击此 slug，则不会发生这种情况。

以下是我如何使用 getStaticPaths 和 getStaticProps 的简化示例：

export const getStaticPaths = async (ctx) => {
  const myInitialPaths = await fetch('http://my-cms-endpoint.com/initial-paths/');
  return {
    paths: [
      ...myInitialPaths
    ],
    fallback: true
  }
}

export const getStaticProps = async ({ params }) => {
  const myPageData = await fetch('http://my-cms-endpoint.com/page/#id');
  
  if (myPageData) {
    return {
      props: {
        myPageData
      }
    }
  } else {
    return {
      notFound: true
    }
  }
}

NextJS页面渲染时显示404页面

0 个答案: