Node.js & Express表单提交返回404：文件上传功能报错求助

兄弟，作为Node.js新手遇到这种404真的太常见了！我刚学的时候也踩过一模一样的坑，咱们一步步来排查：

1. 最核心的问题：有没有配置/upload的POST路由？ #

浏览器跳转到/upload返回404，90%的概率是你的Express应用根本没定义这个路由！不管用formidable还是express-fileupload，必须先给/upload加个POST请求的处理路由：

用express-fileupload的示例代码： #

const express = require('express');
const fileUpload = require('express-fileupload');
const app = express();

// 先挂载文件上传中间件（这步别漏！）
app.use(fileUpload());

// 关键！必须有这个POST /upload路由
app.post('/upload', (req, res) => {
  // 先判断有没有文件上传
  if (!req.files || Object.keys(req.files).length === 0) {
    return res.status(400).send('没选择任何文件哦！');
  }
  // 这里写保存文件的逻辑，比如把文件存到uploads文件夹
  const uploadedFile = req.files.yourFileName; // 这里的yourFileName要和表单里的input name一致
  uploadedFile.mv('./uploads/' + uploadedFile.name, (err) => {
    if (err) return res.status(500).send(err);
    res.send('文件上传成功啦！');
  });
});

用formidable的示例代码： #

const express = require('express');
const formidable = require('formidable');
const app = express();

app.post('/upload', (req, res) => {
  const form = new formidable.IncomingForm();
  // 可以设置上传文件的存储目录
  form.uploadDir = './uploads';
  form.parse(req, (err, fields, files) => {
    if (err) {
      console.error(err);
      return res.status(500).send('上传出错了');
    }
    // 这里可以处理文件重命名等逻辑
    res.send('文件上传成功！');
  });
});

2. 检查你的EJS表单有没有写错 #

打开./views/test2.ejs，确保表单的这几个属性都正确：

<form action="/upload" method="POST" enctype="multipart/form-data">
  <!-- 这里的name属性要和后端代码里的文件名对应，比如上面的yourFileName -->
  <input type="file" name="yourFileName">
  <button type="submit">提交上传</button>
</form>

⚠️ 重点提醒：enctype="multipart/form-data"这个属性绝对不能漏！没有它的话，浏览器根本不会正确发送文件数据，而且可能间接导致路由匹配异常。

3. 确认视图页面能被正确访问 #

你得确保Express能正确渲染test2.ejs，所以要配置视图引擎和对应的GET路由：

// 设置EJS为视图引擎
app.set('view engine', 'ejs');
// 指定视图文件的目录（如果你的视图在./views下，这步可以省略，但写上更稳妥）
app.set('views', './views');

// 渲染test2.ejs页面的路由
app.get('/', (req, res) => {
  res.render('test2');
});

启动服务器后，你要访问http://localhost:3000（假设端口是3000）来打开表单页面，而不是直接打开本地的test2.ejs文件！直接打开本地文件的话，表单提交的是file:///upload，肯定404。

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

确保你的服务器监听了正确的端口，比如：

app.listen(3000, () => {
  console.log('服务器跑在http://localhost:3000啦！');
});

启动后严格按照控制台提示的地址访问，别搞错端口号。

按照这几步排查下来，99%能解决你的404问题！如果还是不行，把你的完整路由代码和表单代码贴出来，我再帮你看~

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