3

我们有一个项目，其中包含一个动态路由 [productId]，在此页面内，我们还有其他几个页面，其中包含可选的包罗万象的路由。以下是 pages 文件夹的结构：

[productId]
  contentOne
    [[...slugOne]]

问题是，只要页面是静态生成的，可选的 catch-all 就不能正常工作。例如： productId/contentOne不起作用，但是productOne/contentOne/extra起作用 只有在vercel中部署时才会出现问题。所有路线都在本地完美运行。

这是getStaticPaths：

export async function getStaticPaths() {    
  return {    
    paths: [],    
     fallback: true,    
   }    
 }

这是getStaticProps：

export async function getStaticProps({ locale }) {
  return {
    props: {
      test: 'test',
      ...(await serverSideTranslations(locale, ['common'])),
    }
  }
}
4

2 回答 2

0

We have an open issue for this: https://github.com/vercel/next.js/issues/30631

Meanwhile, we had to use rewrites (this goes into the next.config file):

async rewrites() {
return {

  beforeFiles: [

   {
     source: '/:productId/contentOne',
     destination: '/:productId/contentOne/index'
   }
  ]
}
于 2022-01-13T16:12:44.990 回答
-1

用于getStaticPaths生成页面时，设置{ fallback: true } 不会导致 404。在开发过程中，它之所以有效，是因为开发使用了自动静态优化的一个版本，其中 Next 正在为服务器呈现的站点提供服务，即使页面将是静态的。

如果您使用 Next 运行 SSR 站点，则设置fallback将提供一个带有空道具的静态页面。这是预期的行为（如果这对您来说是这样的话），您有责任通过重定向客户端或显示您自己的 404 类型或缺少的内容页面来处理该页面。

如果您next export用于构建和导出页面，则设置fallback不会执行任何操作（使用时的预期行为next export），这意味着该页面将不存在并且您的服务器应该通过提供 404 错误页面来处理 404 或将用户重定向到其他地方。

我不确定你所说的“不起作用”是什么意思——它是给你一个 404 错误还是一个空白页面？不管怎样，以上就是原因。

于 2021-08-17T20:11:16.093 回答