Netlify 上 Next.js 的尾部斜线不起作用

Question

我们在 Netlify 上有一个 Next.js 站点，其中包含静态页面和服务器呈现页面。我们有 https://example.com/locations/berlin and we would like to have them to always end with a trailing slash like https://example.com/locations/berlin/ 这样的链接。为此，我们使用 Next.js 的 trailingSlash: true 选项，该选项在本地运行良好。

当我们将站点部署到 Netlify 时出现问题。页面总是被重定向到 url 而没有尾部斜线，就像 Netlify Build Settings 中的 https://example.com/locations/berlin with status code 301. We already enabled Pretty URLs 一样，但这没有区别。

如果我理解正确，trailingSlash: true，Next.js 应该创建这样的静态页面：

https://example.com/locations/berlin/index.html

但它会创建这样的页面：

https://example.com/locations/berlin.html

// next.config.js
module.exports = {
    target: "serverless",
    trailingSlash: true,
};

对于我们的静态页面，我们使用 pages/[...slug].js 文件导出静态路径 fallback: false。

由于我们也使用服务器呈现的页面，因此我们不能使用 next export。

# netlify.toml

[build]
    command = "yarn build"

[[plugins]]
    package = "@netlify/plugin-nextjs"

// package.json

{
  ...
  "scripts": {
    "build": "next build",
    ...
  }
}

版本

下一个：10.2.0
@netlify/plugin-nextjs: 3.2.0

预期行为

不带尾部斜杠的页面将使用状态代码 301 重定向到带有尾部斜杠
带有尾部斜杠的页面直接加载状态代码 200

Answer 1

目前在 Neltify 上似乎没有一种简单的方法可以使尾部斜线与 Next.js 一起使用，因此我们决定改用 Vercel。该平台总体上似乎更适合 Next.js，这并不奇怪，因为它是由同一家公司开发的。

Netlify 上 Next.js 的尾部斜线不起作用

Trailing slash for Next.js on Netlify not working

redirect

netlify

next.js