如何在AWS Amplify中配置尾部斜杠URL的重定向规则？

你可以通过在AWS Amplify中添加重写/重定向规则来解决这个问题，具体操作如下：

• 登录AWS Amplify控制台，打开你的Next.js应用
• 切换到部署标签页，选择重写和重定向选项
• 在规则列表中添加以下规则（可追加到现有规则后）：

[
  {
    "source": "/<*>/",
    "target": "/<*>",
    "status": "301",
    "condition": null
  }
]

这个规则会匹配所有带尾部斜杠的URL路径（例如/about/），将其301永久重定向到去掉尾部斜杠的对应路径（/about），同时完整保留路径中的其他参数。

另外，确保你的Next.js项目配置文件next.config.js中明确设置trailingSlash: false（默认即为该值，显式声明可避免歧义），保证构建生成的页面路径不带尾部斜杠，与Amplify规则形成配合：

/** @type {import('next').NextConfig} */
const nextConfig = {
  trailingSlash: false,
  // 其他项目配置...
}

module.exports = nextConfig

添加规则后保存，等待Amplify完成重新部署，之后无论是访问带尾部斜杠还是不带斜杠的URL，都能正常加载页面，带斜杠的URL会自动跳转至无斜杠版本。

内容的提问来源于stack exchange，提问作者Anatol Zakrividoroga