Next.js 13.4.5部署至Firebase时重定向自动追加.txt后缀问题

以下是几个关键排查和修复步骤：

• 检查并修正firebase.json配置
  静态导出的Next.js应用需要Firebase Hosting正确映射无后缀路径到对应的.html文件，确保你的firebase.json包含以下配置：

  {
    "hosting": {
      "public": "out",
      "ignore": [
        "firebase.json",
        "**/.*",
        "**/node_modules/**"
      ],
      "rewrites": [
        {
          "source": "**",
          "destination": "/index.html"
        }
      ],
      "cleanUrls": true
    }
  }
  

  其中cleanUrls会自动移除URL中的.html后缀，同时让无后缀路径正确匹配到对应的页面文件。

• 确认本地静态导出的文件结构
  执行npm run build后，检查项目根目录下的out文件夹：

  • 正常情况下，/dashboard对应的文件应该是out/dashboard.html，而非dashboard.txt
  • 如果本地导出就出现.txt文件，说明Next.js的导出配置或页面代码存在异常，需排查页面组件是否有错误生成文件的逻辑

• 验证router.push()的调用语法
  再次确认代码中router.push()的参数是否正确，比如是否误写为router.push('/dashboard.txt')，确保路径是纯无后缀的格式：

  router.push('/dashboard')
  

• 清除Firebase缓存并重新部署
  旧的缓存可能导致异常路由生效，执行以下操作：

  1. 重新执行npm run build生成最新的静态文件
  2. 运行firebase deploy --only hosting重新部署
  3. 在浏览器中强制刷新页面（Ctrl+Shift+R），或在Firebase控制台的Hosting页面手动清除缓存

• 配置正确的MIME类型（可选）
  如果上述步骤无效，可能是Firebase错误识别了.html文件的类型，在firebase.json中添加headers配置强制指定Content-Type：

  {
    "hosting": {
      // ...其他配置
      "headers": [
        {
          "source": "**/*.html",
          "headers": [
            {
              "key": "Content-Type",
              "value": "text/html"
            }
          ]
        }
      ]
    }
  }
  

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