本地/form路径正常，部署Firebase后出现404错误求助

看起来你遇到的问题是本地Express服务能正常响应/form路由，但部署到Firebase后就返回404，结合你的代码和Firebase的特性，我整理了几个排查和解决方向：

1. 明确Firebase的部署方式 #

你的代码是基于Express的动态路由，但Firebase Hosting默认是静态文件托管——它只会直接返回public目录下的文件，不会识别Express里定义的/form这类动态路由。所以如果只是把静态文件上传到Hosting，肯定会出现404。

正确的做法是用Firebase Functions来部署你的Express后端，再通过Hosting的重写规则把请求转发到Functions。

2. 配置firebase.json的重写规则 #

在项目根目录的firebase.json里，需要添加重写规则，让所有请求都转发到你的Express函数：

{
  "hosting": {
    "public": "public",
    "rewrites": [
      {
        "source": "**",
        "function": "app"
      }
    ]
  },
  "functions": {
    "source": "."
  }
}

这里的app是你后面要在Functions里导出的Express应用名称。

3. 修正Express代码的路径问题 #

你的根路由/的sendFile写法有问题，应该用绝对路径拼接，避免部署后路径错误：

app.get('/', function(req, res){
  res.sendFile(path.join(__dirname, 'public/index.html'));
});

另外确认下form.html确实在public目录下，本地测试时路径没问题，但部署到Firebase后文件结构要和本地一致。

4. 迁移代码到Firebase Functions #

如果还没初始化Functions，按下面步骤来：

• 执行firebase init functions初始化Functions模块（选择JavaScript/TypeScript，按提示操作）
• 把你的Express代码迁移到functions/index.js（或者你自己的入口文件），然后导出Express应用：

const functions = require('firebase-functions');
const express = require('express');
const path = require('path');
const bodyParser = require('body-parser');

const app = express();

app.use(express.static(path.join(__dirname, '../bower_components')));
app.use(express.static(path.join(__dirname, '../public')));
app.use(bodyParser.urlencoded({extended: true}));

app.get('/', function(req, res){
  res.sendFile(path.join(__dirname, '../public/index.html'));
});

app.get('/form', function(req,res){
  res.sendFile(path.join(__dirname, '../public/form.html'));
});

exports.app = functions.https.onRequest(app);

注意这里的路径要调整，因为Functions的代码在functions目录下，所以要回到上一级找public和bower_components。

• 最后执行firebase deploy --only functions,hosting同时部署Functions和Hosting。

5. 验证部署结果 #

部署完成后，访问你的Firebase Hosting域名，应该就能正常访问/form路径了。如果还是有问题，可以查看Firebase控制台的Functions日志，看看有没有报错信息。

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