使用Node.js+Express+Formidable上传文件无响应，控制台无日志求助

核心问题与修复方案 #

• body-parser 与 Formidable 冲突
  body-parser 无法处理 multipart/form-data 类型请求，且你配置的 body-parser 会提前解析请求体，导致 Formidable 无法获取上传的文件数据，因此不会触发任何回调日志。需要直接移除所有 bodyParser 中间件配置。

• 文件输入框缺少 name 属性
  HTML 中的文件上传输入框未设置 name 属性，Formidable 无法识别该字段，自然不会触发 file、fileBegin 等事件。必须给 <input type="file"> 添加 name 属性（如 name="uploadFiles"）。

• 请求未结束导致页面无限加载
  POST 接口处理完文件解析后，未给客户端返回响应，浏览器会一直等待服务器回复，造成页面持续加载。需在 form.parse 的回调中添加响应语句（如 res.send('文件上传完成')）结束请求。

• 拼写错误
  回调参数中的 fileds 是拼写错误，应为 fields。

修正后的 HTML 文件 #

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>文件上传</title>
</head>
<body>
<form action="/" method="post" enctype="multipart/form-data">
    <!-- 添加name属性，让Formidable识别文件字段 -->
    <input type="file" name="uploadFiles" multiple/>
    <input type="submit" value="Upload" />
</form>
</body>
</html>

修正后的 server.js #

const express = require("express")
const fm = require("formidable")
const app = express()

// 移除body-parser中间件，避免与Formidable冲突
app.get("/", (req, res)=>{
    res.sendFile(__dirname + "/file.html")
})

app.post("/", (req, res)=>{
    const form = new fm.IncomingForm()
    
    // 修正拼写错误：fileds -> fields，添加错误处理
    form.parse(req, (err, fields, files)=>{
        if(err){
            console.error("文件解析失败：", err)
            return res.status(500).send("上传失败")
        }
        console.log("解析得到的文件：", files)
        // 发送响应，结束请求
        res.send("文件上传完成")
    })

    form.on("fileBegin", (name, file)=>{
        console.log("开始上传文件：", name, file.path)
    })

    form.on("file", (name, file)=>{
        console.log("已完成上传：", name, file.name)
    })
})

app.listen(3000, ()=>{
    console.log("服务器运行在 http://localhost:3000")
})

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