express 使用 multer 做文件上传时自定义文件名和存储路径

最新推荐文章于 2025-06-16 22:18:17 发布

原创最新推荐文章于 2025-06-16 22:18:17 发布 · 5.3k 阅读

12 ·

CC 4.0 BY-SA版权

node 专栏收录该内容

13 篇文章

订阅专栏

本文介绍了如何在Express中使用multer模块进行文件上传，并着重讲解了如何自定义存储路径和文件名。multer的官方文档推荐使用最新版本，中文文档可能已过时。通过示例代码展示了基本的单文件上传流程以及如何避免丢失文件后缀的问题。在指定存储路径时，若使用函数则路径需已存在，而字符串形式则multer会尝试创建路径。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一、简洁

multer 更新到1.x之后无法直接通过 app.use(multer()); 这样的方式去使用。

multer 的文档地址：

https://github.com/expressjs/multer

中文文档的翻译也是2016年10月的，不建议看中文文档。

安装：

yarn add multer

引入：

const multer = require('multer');

二、基本使用 - 上传单文件

上面已经引入了 express、body-parser、multer、path

const app = express();
const upload = multer({dest:path.join(__dirname,'./public/uploads')});

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

app.use('/',express.static('views'));

app.post('/',upload.single('file'),(req,res)=>{
  res.send(req.file);
});

HTML页面：

文件上传后，信息会存储在 req.file，主要信息是下面：

三、`diskStorage` 指定存储路径和文件名

上面上传单文件的方法简答粗暴，并且有很大的问题，不能保存文件后缀（可以看上面的文件path，没有后缀）

const app = express();
const storage = multer.diskStorage({
  // destination:'public/uploads/'+new Date().getFullYear() + (new Date().getMonth()+1) + new Date().getDate(),
  destination(req,res,cb){
    cb(null,'public/uploads/'+new Date().getFullYear() + (new Date().getMonth()+1) + new Date().getDate());
  },
  filename(req,file,cb){
    const filenameArr = file.originalname.split('.');
    cb(null,Date.now() + '-' + filenameArr[filenameArr.length-1]);
  }
});
const upload = multer({storage});

app.use(bodyParser.urlencoded({extended:true}));

app.use('/index',express.static('./views/index.html'));

app.post('/',upload.single('file'),(req,res)=>{
  console.log(req.body);
  console.log(req.file);
  res.send(req.file);
});

上面的关键方法就是：

var storage = multer.diskStorage({
  destination: function (req, file, cb) {
    cb(null, '/tmp/my-uploads')
  },
  filename: function (req, file, cb) {
    cb(null, file.fieldname + '-' + Date.now())
  }
})

var upload = multer({ storage: storage })