如何在Node.js服务器解析FormData上传的文件？附客户端Axios代码

你用Axios通过FormData提交文本数据和文件到Node.js后端，最靠谱的方案是用multer这个中间件——毕竟Express框架本身没办法直接解析multipart/form-data格式的请求，multer就是专门用来处理这类文件上传场景的工具。

下面一步步给你讲具体实现：

1. 先安装multer #

打开终端，在你的Node.js项目里执行安装命令：

npm install multer
# 或者用yarn
yarn add multer

2. 配置multer的存储规则 #

你可以选择把文件存在本地磁盘，或者临时存在内存里（比如要转存到云存储的话）。这里先以存本地磁盘为例：

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

// 配置磁盘存储：指定文件保存的目录和文件名规则
const storage = multer.diskStorage({
  // 目标存储目录，记得先在项目根目录创建好uploads文件夹！
  destination: (req, file, cb) => {
    cb(null, './uploads/');
  },
  // 自定义文件名，避免重名冲突
  filename: (req, file, cb) => {
    // 用时间戳+原文件名组合，保证唯一性
    cb(null, `${Date.now()}-${file.originalname}`);
  }
});

// 初始化multer实例，传入存储配置
const upload = multer({ storage: storage });

3. 编写处理上传的路由 #

对应你前端的POST请求路径/businesses/，我们用upload.single('selectedFile')来处理单个文件上传（这里的selectedFile要和你前端FormData里append的文件字段名完全一致）：

// 处理文件和数据上传的POST路由
app.post('/businesses/', upload.single('selectedFile'), (req, res) => {
  // 文本数据都在req.body里，对应你前端append的title、ownedby、locality
  const { title, ownedby, locality } = req.body;
  // 上传的文件信息在req.file里，包含文件路径、大小、原文件名等
  const uploadedFile = req.file;

  // 这里可以添加你的业务逻辑，比如把数据存入数据库，处理文件等
  console.log('收到的文本数据：', req.body);
  console.log('收到的文件信息：', uploadedFile);

  // 给前端返回成功响应
  res.status(200).json({
    message: '文件和数据上传成功',
    result: {
      title,
      ownedby,
      locality,
      file: {
        name: uploadedFile.originalname,
        path: uploadedFile.path,
        size: uploadedFile.size
      }
    }
  });
});

// 启动服务器监听3000端口
app.listen(3000, () => {
  console.log('服务器运行在 http://localhost:3000');
});

一些补充说明 #

• 如果你需要上传多个文件，可以把upload.single()换成upload.array('selectedFile', 5)（第二个参数是最多允许上传的文件数量），或者用upload.fields([{name: 'file1'}, {name: 'file2'}])来处理不同字段名的多个文件。
• 如果不想把文件存在本地，而是要直接处理文件内容（比如上传到OSS），可以用内存存储：const upload = multer({ storage: multer.memoryStorage() })，这时文件内容会存在req.file.buffer里。
• 一定要提前创建好uploads目录，不然multer会抛出找不到目录的错误。

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