Azure上的Nextjs应用程序静态Web应用程序路由问题

cnh2zyt3  于 2023-05-17  发布在  其他
关注(0)|答案(1)|浏览(147)

我已经构建了一个Nextjs应用程序,通过API显示数据库中的数据。数据应显示为文件夹结构。如果数据库中的行标记为文件夹,则应显示为文件夹,否则应显示为文件。如果我点击文件夹,然后一个API调用,其中显示的文件和文件夹内。同样,可以有多个文件夹或文件夹内的文件夹。
该应用程序作为Azure静态Web应用程序托管。我面临的问题是,当我在一个文件夹内,当我刷新页面,我得到404错误。问题似乎与路由配置有关。我尝试添加staticwebapp.config.json,回退路由,但在这种情况下,它重定向到主页。
理想情况下,它应该与我刷新页面的文件夹保持在同一页面上。
任何关于如何在Nextjs/静态Web应用程序上设置动态路由的指导都将是有帮助的。
谢了Rajesh

ibps3vxo

ibps3vxo1#

正如在document中提到的:
您可以通过定义筛选器来控制哪些请求返回回退文件。在以下示例中,对/images文件夹中的某些路由和/css文件夹中的所有文件的请求将被排除在返回回退文件之外。

{
  "navigationFallback": {
    "rewrite": "/index.html",
    "exclude": ["/images/*.{png,jpg,gif}", "/css/*"]
  }
}

下面的示例文件结构,使用此规则可能会产生以下结果。

├── images
│   ├── logo.png
│   ├── headshot.jpg
│   └── screenshot.gif
│
├── css
│   └── global.css
│
└── index.html

也请参考此similar discussion here

相关问题