Node.js - multer (파일 업로드)

multer

• express 기본 기능에는 파일 업로드 기능이 포함되어 있지 않다.
• multer는 사용자 파일 업로드 기능을 제공하는 패키지로, 사용자가 전송한 파일을 처리하는 작업을 수행한다.

패키지 설치

$ npm install --save multer

---

사용 예제

📄app.js

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

app.set('view engine', 'pug');
app.set('views', path.join(__dirname, 'html'));

app.get('/upload', function(req, res){
  res.render('upload');
});
app.post('/upload', upload.single('userfile'), function(req, res){
  res.send('Uploaded : '+req.file.filename);
});

• multer 객체를 { dest: 'uploads/' }로 생성해 활용한다.
• upload는 업로드를 받을 수 있는 객체가 되며, dest는 파일이 저장될 위치를 의미한다. (즉, uload 폴더에 파일이 저장된다.)
• 사용자로부터 /upload url에 대한 post 요청을 받으면 upload.single('userfile')이 실행된다.
• upload.single('userfile')는 요청받은 파일을 dest위치에 저장함과 동시에 req 객체에 file이라는 속성을 추가하여 관련 정보를 저장하는 미들웨어이다.
• 여기서 userfile은 파일을 입력받는 input태그의 name 속성이다. (아래 파일 참고)

 

📄upload.pug

doctype html
html
  head
    meta(chartset='utf-8')
  body
    form(action='upload' method='post' enctype="multipart/form-data")
      input(type='file' name='userfile')
      input(type='submit')

• pug(jade) 파일은 위와 같이 작성하여 사용자로부터 파일을 받을 수 있도록 한다.
• enctype="multipart/form-data"을 해야 정상적으로 전송받을 수 있다.

---

storage

var _storage = multer.diskStorage({
  destination: function (req, file, cb) {
    cb(null, 'uploads/')
  },
  filename: function (req, file, cb) {
    cb(null, file.originalname);
  }
})
var upload = multer({ storage: _storage })

• multer에 dest 옵션 대신 storage 옵션을 사용하면 더 많은 설정이 가능하다.
• file.originalname을 통해 파일의 원래 이름으로 파일이 저장되도록 할 수도 있다.
• multer.diskStorage를 통해 storage 객체를 만들고, 이를 옵션으로 사용한다.
• 함수가 섞여있어 복잡해 보이지만 결국은 cb의 두 번째 파라미터만 조작하면 된다.