Firebase Hosting部署Flutter Web动态路径重写404问题

你遇到404的核心原因是Flutter Web属于单页应用，所有页面渲染逻辑都打包在index.html加载的前端脚本中，服务器上不存在/item/:idItem对应的物理文件，你之前配置的重写规则把请求转发到不存在的物理路径，自然触发404。

正确配置方式 #

修改firebase.json中的hosting重写规则，将/item路径下的所有请求统一转发到根目录的index.html即可，浏览器地址栏的原始路径会完整保留，不会影响前端读取路径参数：

{
  "hosting": {
    "public": "build/web",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ],
    "rewrites": [
      {
        "source": "/item/**",
        "destination": "/index.html"
      },
      {
        "source": "**",
        "destination": "/index.html"
      }
    ]
  }
}

配置说明 #

• 重写规则按从上到下的优先级匹配，必须把路径更精确的/item/**规则放在通用通配规则**前面，避免被通用规则提前覆盖。
• 不需要在destination字段中携带路径参数，重写只是服务器内部把请求转发给index.html处理，用户浏览器地址栏的URL不会变化，你的Flutter代码中通过Uri.base.path或者路由框架读取路径时，可以完整获取到/item/xxx格式的路径，正常解析idItem参数渲染详情页。
• 配置完成后执行firebase deploy --only hosting重新部署即可生效，不需要修改前端的路由判断逻辑。

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