Firebase部署Express+Multer多表单上传时req.body/req.file为空的解决办法

哈哈，这个坑我之前踩过！本地跑Express+Multer完全正常，一部署到Firebase Hosting就出现req.body和req.file全空的情况，核心原因其实是Firebase Hosting本身是静态资源托管服务，它不会直接运行你的Node.js Express服务器代码——你得把Express接口放到Cloud Functions里，再通过Hosting的重写规则把请求转发过去才行。

下面是具体的解决步骤，亲测有效：

1. 将Express应用迁移到Cloud Functions #

首先要把你的Express接口包装成Firebase Cloud Functions的HTTP函数，这样Firebase才能在云端运行你的Node.js代码：

const functions = require('firebase-functions');
const express = require('express');
const multer = require('multer');
const os = require('os');

const app = express();

// 保留你原来的Multer配置和接口逻辑
app.post('/', multer({ dest: os.tmpdir(), limits: { fileSize: 5242880 } }).single('image_file'), (req, res) => {
  console.log("req.body : ", req.body);
  console.log("req.file : ", req.file);
  // 别忘了添加响应逻辑，比如返回处理结果
  res.status(200).json({ 
    message: "表单解析成功",
    body: req.body,
    file: req.file ? { filename: req.file.filename, size: req.file.size } : null
  });
});

// 将Express app导出为Cloud Function
exports.api = functions.https.onRequest(app);

2. 配置Firebase Hosting的重写规则 #

修改项目根目录下的firebase.json，添加重写规则，让用户的请求转发到刚才创建的Cloud Function：

{
  "hosting": {
    "public": "public", // 你的静态资源目录
    // 其他Hosting配置（比如headers、cleanUrls等）
    "rewrites": [
      {
        "source": "/**", // 匹配所有请求，或者指定你的接口路径比如"/"
        "function": "api" // 这里要和你导出的Cloud Function名称一致
      }
    ]
  }
}

3. 部署Cloud Functions和Hosting #

最后用Firebase CLI部署你的函数和托管配置：

firebase deploy --only functions,hosting

额外注意事项 #

• 为什么本地正常？因为本地你是直接启动Express服务器，请求直接由Node.js处理；而Firebase Hosting静态模式下只会返回静态文件，根本没触发你的Express代码，Multer自然没机会解析表单数据。
• Cloud Functions的临时目录（os.tmpdir()）是临时存储，文件在函数执行结束后会被清理，如果需要持久化上传的文件，记得把它上传到Firebase Storage。
• 确认客户端请求的Content-Type是multipart/form-data，这个本地正常的话一般没问题，但部署后可以用浏览器开发者工具检查一下请求头。

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