使用Node.js+Multer向Heroku上传图片失败，本地运行正常

嘿，这个问题我太熟了——Heroku的临时文件系统特性就是你踩的坑！

问题根源 #

你的本地测试正常是因为本地文件系统是持久化的，但Heroku的dyno（运行你应用的容器）用的是临时文件系统，这会导致两个核心问题：

1. 你代码里指定的./uploads目录，在Heroku部署后大概率没有自动创建，直接触发上传时的500错误（对应你日志里的POST /uploadcarimage 500）
2. 就算侥幸上传成功，只要dyno重启（比如重新部署、休眠唤醒、资源调度），所有本地存储的文件都会被清空，后续访问自然会出现404（对应日志里的GET请求404）

解决方案：改用云存储 #

放弃本地存储，把图片上传到云存储服务（比如AWS S3、Cloudinary、Google Cloud Storage等），这里以AWS S3为例，用multer-s3替代multer.diskStorage：

第一步：安装依赖

npm install multer-s3 aws-sdk

第二步：修改后端代码

替换你原来的multer配置，改成云存储模式：

const AWS = require('aws-sdk');
const multer = require('multer');
const multerS3 = require('multer-s3');

// 通过Heroku环境变量注入AWS密钥，绝对不要硬编码！
AWS.config.update({
  accessKeyId: process.env.AWS_ACCESS_KEY_ID,
  secretAccessKey: process.env.AWS_SECRET_ACCESS_KEY,
  region: '你的S3桶所在区域'
});

const s3 = new AWS.S3();

// 用multer-s3替代本地磁盘存储
const upload = multer({
  storage: multerS3({
    s3: s3,
    bucket: '你的S3桶名称',
    metadata: (req, file, cb) => {
      cb(null, { fieldName: file.fieldname });
    },
    key: (req, file, cb) => {
      // 可以自定义文件名，比如加个时间戳避免重名
      cb(null, `${Date.now()}-${file.originalname}`);
    }
  })
});

router.post('/', upload.single('carImage'), (req, res) => {
  console.log(req.file); // 现在req.file里会包含S3上的文件URL
  res.json({ imageUrl: req.file.location }); // 返回云存储地址给前端
});

第三步：配置Heroku环境变量

在Heroku控制台或者用CLI设置AWS密钥（避免代码泄露敏感信息）：

heroku config:set AWS_ACCESS_KEY_ID=你的密钥ID
heroku config:set AWS_SECRET_ACCESS_KEY=你的密钥

前端代码无需修改

你的FormData上传逻辑完全没问题，只要后端返回正确的云存储URL，后续访问就不会出现404了。

额外提醒 #

• 绝对不要在Heroku上存储任何需要持久化的文件，用户上传内容、静态资源都应该放在云存储或CDN上
• 如果只是临时调试，可以用multer.memoryStorage()把文件存在内存里，但重启后同样会丢失，只适合短期测试

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