使用axios如何上传文件 前端和后端代码

前端代码：

// 定义一个FormData对象
const formData = new FormData();

// 将文件添加到FormData对象中
formData.append('file', file);

// 使用axios发送POST请求上传文件
axios({
  method: 'post',
  url: '/api/upload',
  data: formData,
  headers: { 'Content-Type': 'multipart/form-data' },
})
  .then(response => {
    console.log('上传成功', response);
  })
  .catch(error => {
    console.log('上传失败', error);
  });

后端代码（Node.js）：

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

const app = express();
const upload = multer({ dest: 'uploads/' });

app.post('/api/upload', upload.single('file'), (req, res, next) => {
  // 获取上传的文件信息
  const file = req.file;
  console.log(file);

  // 返回上传成功的信息
  res.send({ message: '上传成功' });
});

app.listen(3000, () => {
  console.log('Server is running on port 3000.');
});

在上面的代码中，我们使用了`multer`中间件来处理上传的文件，`upload.single('file')`表示只处理单个名为`file`的文件。在后端代码中，我们可以通过`req.file`获取上传的文件信息。