使用 Express 和 Multer 进行文件上传：获取一个随机名称和未知格式的文件

Question

我是网络开发的新手，如果这是一个很糟糕的问题，我很抱歉。我正在构建一个可以上传 zip 文件和一些表单数据的网络应用程序。

在客户端，我使用的是 axios，这里是一段代码：

  handleSubmitClick = (e) => {
    console.log(this)
    e.preventDefault();    

    const formData = new FormData();
    formData.append('uploaded_file',this.state.file)
    formData.append('studyID',this.state.studyID)
    formData.append('modality',this.state.modality)
    const config = {
        headers: {
            'Content-Type': 'multipart/form-data'
        }
    }
    return post('/test_post', formData, config)
  }

在后端 api 端，我使用带有 Multer 中间件的 Express 来接收文件：

import express from 'express';
import cors from 'cors';

var bodyParser = require('body-parser')
var multer = require('multer');
var upload = multer({ dest: 'uploads/' })
const path = require('path');

const initializeExpress = (): void => {
  const app = express();

  app.use(cors());
  app.use(express.json());
  // app.use(express.urlencoded());
  app.use(express.urlencoded({ extended: true }));
  app.use(bodyParser.urlencoded({ extended: true }));
  app.use(bodyParser.json());

  app.use(express.static(path.join(__dirname, 'build')));
  

  app.post('/test_post', upload.single('uploaded_file'), function (req, res){
    console.log('---------- post test_post ----------')
    console.log("req.body: ", req.body)
    console.log('--------------------------------')
    
    return res.send('pong');
  })
 
  app.listen(process.env.PORT || 3000);
};

initializeExpress();

当 select 一个 zip 文件并点击网页上的“发送”按钮时，我可以在 Express 后端 api 端看到以下控制台日志：

---------- post test_post ----------
req.body:  [Object: null prototype] {
  studyID: '123qwe',
  modality: 'CT'
}
--------------------------------

表单数据 studyID 和 modality 被正确接收。由于这两个表单数据是从 selected 文件中自动提取的，因此我可以确认该文件是 selected 没有问题的。（this.state.file确实指向正确的文件对象）

但是，uploaded_file字段是一个空字符串，并且有一个文件uploads/文件夹：

- uploads
     3b3b93d6c2db52ff6d66d60d0315d7fc

原始文件 selected 是 testfile.zip，但此文件的格式未知且名称随机。

我该如何解决？

Answer 1

The original file selected was testfile.zip, but this file has unknown format and a random name.

您需要的是控制文件的名称和扩展名。您可以使用 storage option

您可以替换此行：

var upload = multer({ dest: 'uploads/' });

作者：

const storage = multer.diskStorage({
  destination: function (req, file, cb) {
    cb(null, 'uploads/') // where files will be saved
  },
  filename: function (req, file, cb) {
    cb(null, file.originalname) // using the file's original name
  }
})
 
const upload = multer({ storage: storage })

使用 Express 和 Multer 进行文件上传：获取一个随机名称和未知格式的文件

Using Express and Multer for file uploading: getting a file in random name and unknown format

node.js

express

multer