使用 Node.js 发送多部分表单数据 Axios

当我们需要上传文件或者向服务器发送不仅仅是文本数据的内容时，我们就需要使用多部分表单数据（Multipart Form Data）。Axios是一个非常流行的HTTP库，我们可以使用它来发送多部分表单数据。

准备工作

在开始之前我们需要先安装Axios和multer（处理上传文件的中间件）。

npm install axios multer --save

代码实现

下面是一个简单的实例，我们向服务器上传一个图片文件和一个文本参数：

const axios = require('axios');
const multer = require('multer');

// 创建上传中间件
const upload = multer({
  dest: 'uploads/' // 上传到服务器上的目录路径
});

// 创建一个axios实例，用于发送请求
const instance = axios.create({
  baseURL: 'http://localhost:3000', // 服务器地址
  timeout: 1000, // 超时时间
});

// 使用上传中间件
app.post('/upload', upload.fields([
  { name: 'avatar', maxCount: 1 }, // 文件字段名为avatar，最多上传1个文件
  { name: 'username', maxCount: 1 }, // 文本字段名为username，最多上传1个
]), function (req, res, next) {
  const { avatar, username } = req.files;
  const { name } = req.body;

  // 创建多部分表单数据
  const formData = new FormData();
  formData.append('avatar', avatar[0]);
  formData.append('username', username[0]);
  formData.append('name', name);

  // 发送请求
  instance.post('/upload', formData, {
    headers: {
      'Content-Type': 'multipart/form-data',
    }
  }).then(response => {
    res.send(response.data);
  }).catch(error => {
    res.status(500).send(error);
  })
});

在这个例子中，我们使用了multer中间件来处理上传文件，其中upload.fields方法配置了两个字段，一个文件字段名为avatar，一个文本字段名为username。然后我们通过FormData对象将这两个字段和一个普通的文本字段name组成了一份多部分表单数据。最后我们将其通过axios实例的post方法发送到服务器上。

需要注意的是，在发送请求的时候我们需要将Content-Type头设置为multipart/form-data，否则服务器将无法解析数据并返回错误信息。

总结

Axios提供了非常方便的API用于发送HTTP请求，同时它也支持发送多部分表单数据。通过上面的例子，我们可以非常简单地将文件和文本数据一起上传到服务器。