next.js 导出静态 - S3 - 页面重新加载时路由失败

Question

我正在将 next.js 应用程序作为静态导出部署到为静态网站托管配置的 s3 存储桶。

我使用 nextbuild和export命令生成out/目录，然后将其复制到我的 s3 存储桶中

然后存储桶包含一些文件，为简单起见，我们可以说只有index.html和about.html

问题是当用户点击index.html通过www.website.com然后导航到www.website.com/about一切正常时，但重新加载www.website.com/about当然会失败。

www.website.com/about.html 找到正确的资产来呈现网站

有没有办法导出静态 next.js 应用程序，在 s3 上托管，并请求/about代理/about.html？

一如既往，感谢您的关注，更感谢您的参与。

Answer 1

next.config.js在项目根目录下的文件中。

module.exports = {
    trailingSlash: true,
}

现在您可以在目录中创建页面（例如about.jsx）pages，当您运行命令时，Next 将创建一个具有该文件名的文件夹，index.html其中包含一个文件export。

尝试一下，这里效果很好。

Answer 2

迄今为止我得到的最佳解决方案，灵感来自这个要点：https : //gist.github.com/rbalicki2/30e8ee5fb5bc2018923a06c5ea5e3ea5

基本上在将构建部署到 s3 存储桶时，您可以简单地将.html文件重命名为没有.html后缀，例如：www.bucket.com/about.html->www.bucket.com/about现在 SSR 和 CSR 路由都按预期工作。

Content-Type: text/html尽管没有后缀，但生成的文件有，我不知道这是否有问题。