BackEnd/Node.js

[Node.js] Multer 모듈을 이용한 파일 업로드

liveloper jay 2021. 12. 10. 17:39

 Node.js 서버에서는 사용자가 업로드한 파일을 받아서 저장하는 기능을 기본적으로 제공하지 않습니다. 따라서 파일 업로드를 위하여 필요한 모듈을 이용하여 파일 업로드를 진행하여야 합니다. 이때 Multer 모듈을 이용하여 파일 업로드를 진행할 수 있습니다.

1. Multer 모듈이란?

 Multer 모듈은 Node.js에서 이미지, 영상 등의 파일을 multipart/form-data 형식으로 업로드 할때 사용되는 미들웨어 모듈입니다. Multer 모듈은 일반적으로 express.js 와 함께 사용하지만, Node.js의 다른 프레임워크와도 함께 사용할 수 있습니다. 또 편리한 API를 제공하여 파일 업로드 처리 작업을 단순화합니다. 

Multer를 이용하여 파일 업로드시 파일 저장 위치, 파일 최대 크기의 제한 등의 다양한 옵션을 지정할 수 있습니다. 이를 통해 업로드 된 파일의 관리에 유연성을 제공합니다. 아래는 Multer 모듈을 이용한 파일 업로드 예제 입니다.

 

$ npm install multer --save

 

const express = require('express');
const multer = require('multer');
const storage = multer.diskStorage({
  destination: function (req, file, cb) { 
    cb(null, 'uploads/')  
  },
  filename: function (req, file, cb) {
    cb(null, file.originalname)              // 원래 파일이름으로 저장
  }
})

const upload = multer({storage: storage })     // storage를 호출


app.post('/upload', upload.single('file'), (req, res) => {
  console.log(req.file);
  res.send('File uploaded 완료!');
});

 

여기서 여러개의 파일을 업로드 하고자 하는 경우 upload.single() 대신 upload.array()를 이용해 주면 여러개의 파일을 동시에 업로드 하는 것이 가능합니다.

const express = require('express');
const multer = require('multer');
const storage = multer.diskStorage({
  destination: function (req, file, cb) { 
    cb(null, 'uploads/')  
  },
  filename: function (req, file, cb) {
    cb(null, file.originalname)              // 원래 파일이름으로 저장
  }
})

const upload = multer({storage: storage })     // storage를 호출



app.post('/upload', upload.array('files', 3), (req, res) => {
  console.log(req.file); 
  res.send('3개의 File uploaded 완료!');
});

 

2. Multer 모듈 파일 업로드 시 파일 이름 중복 문제 해결

 위의 과정을 따라 파일을 업로드 시 file.originalname을 사용하기 때문에 파일의 원래 이름으로 업로드가 진행되게 됩니다. 이 과정에서 동일한 파일을 여러번 중복해서 업로드 하게 될 경우 파일의 이름이 동일하여, 삭제 시 원치 않은 파일도 함께 삭제되는 문제가 발생하게 됩니다.
이와 같은 문제의 발생을 방지하기 위해 파일 업로드 시 파일 이름 앞에 업로드 시간을 추가하여 문제를 해결할 수 있습니다.

const path = require('path');

const upload = multer({
  storage: multer.diskStorage({
    destination: function (req, file, cb) {
      cb(null, 'images/');
    },
    filename: function (req, file, cb) {
      cb(null, new Date().valueOf() + path.extname(file.originalname));  // 파일 이름에 date를 추가하여 중복되는 것을 방지
    }
})

const upload = multer({storage: storage })     // storage를 호출


app.post('/upload', upload.single('file'), (req, res) => {
  console.log(req.file);
  res.send('File uploaded 완료!');
});