使用Multer实现文件上传时持续出现404错误，如何解决？

我尝试使用Multer实现文件上传功能，但始终遇到404错误，请问该如何解决？以下是我的app.js代码：

var createError = require('http-errors'); 
var express = require('express'); 
var path = require('path'); 
var cookieParser = require('cookie-parser'); 
var logger = require('morgan'); 
var indexRouter = require('./routes/index'); 
var usersRouter = require('./routes/users'); 
var app = express(); 
var session = require('express-session'); 
var flash = require('connect-flash'); 
// 代码未完整展示

404错误本质是请求的路由未被正确匹配或注册，结合Multer的使用场景，我给你梳理几个排查方向：

1. 先确认Multer的基础配置是否到位 #

首先确保你已经安装并正确引入了Multer：

npm install multer --save

在app.js或对应的路由文件里添加引入：

const multer = require('multer');

然后配置Multer的存储规则（这一步很容易被忽略，没配置的话上传逻辑根本跑不起来）：

// 配置文件存储路径和文件名规则
const storage = multer.diskStorage({
  destination: function (req, file, cb) {
    // 手动创建uploads文件夹，否则会因目录不存在报错
    cb(null, './uploads');
  },
  filename: function (req, file, cb) {
    // 用时间戳避免文件名重复
    cb(null, Date.now() + '-' + file.originalname);
  }
});

// 创建Multer实例
const upload = multer({ storage: storage });

2. 检查上传路由是否正确注册 #

这是404最常见的原因，确保你的上传接口路由被正确定义并挂载：
比如在routes/index.js里添加：

const express = require('express');
const router = express.Router();
// 这里如果Multer配置在app.js里，就从app.js引入，或者直接在路由文件里配置
const upload = require('../app'); 

// 定义POST类型的上传接口，路径为/upload
router.post('/upload', upload.single('file'), (req, res) => {
  if (!req.file) {
    return res.status(400).send('请选择要上传的文件');
  }
  res.status(200).send(`文件上传成功：${req.file.filename}`);
});

module.exports = router;

然后在app.js里确保路由挂载顺序正确（必须在404错误处理中间件之前）：

// 先挂载路由
app.use('/', indexRouter);

// 再处理404错误
app.use(function(req, res, next) {
  next(createError(404));
});

3. 确认请求路径和参数名匹配 #

• 前端请求的URL必须和后端路由一致：比如后端定义的是/upload，前端就要请求POST http://localhost:3000/upload（端口要和你服务器监听的一致）
• 前端文件输入框的name属性必须和后端upload.single('file')里的参数一致：
  比如前端表单：

  <form action="/upload" method="post" enctype="multipart/form-data">
    <input type="file" name="file">
    <button type="submit">上传文件</button>
  </form>
  

  如果前端name是avatar，后端就要改成upload.single('avatar')，否则Multer无法识别文件，也可能导致请求异常。

4. 检查服务器启动配置 #

确保app.js最后启动了服务器：

const port = 3000;
app.listen(port, () => {
  console.log(`服务器运行在 http://localhost:${port}`);
});

请求时必须使用这个端口，否则也会出现404。

如果按以上步骤排查后还是有问题，可以把完整的路由配置和前端请求代码贴出来，我再帮你进一步定位问题。

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