NODE JS ] multer 로 파일 전송하기

채팅기능 중에 파일전송을 추가하고 싶어서 찾아봤다.

 

nodejs에서 제공하는 파일을 전송하는 방법은 multer , multiparty 두가지가 있음

 

한국말 지원이 되서 사용하기 편리함 

https://www.npmjs.com/package/multer

multer

npm install multer --save 로 설치

 

내 채팅에서는 js로 form 태그에 필요한 정보를 추가해서 클라이언트에서 처리했음

var add_form = document.getElementById("chat_form");
            add_form.name = "file";
            add_form.action = "/chat";
            add_form.method = "post";
            add_form.enctype = "multipart/form-data";
            add_form.submit();

서버에서 파일을 받는 부분 

//app.js
var multer = require('multer');

var storage = multer.diskStorage({
    destination: function (req, file, cb) {
        cb(null, '파일 업로드 경로') // 파일을 저장 경로를 설정하는 부분
    },
    filename: function (req, file, cb) {
        cb(null, file.originalname); //파일 이름을 정하는 부분
    }
});
var upload = multer({storage: storage});

원본파일의 이름 그대로 파일을 저장하도록 하였다. 

app.post('/chat', upload.array('file', 5), function (req, res, next) {
   //TODO: 할일을 여기다가 작성하면됨
    res
        .status(204)
        .end(); 
});

app.post 두번째 파라미터에 upload.array('file' , 5) 를 보게 되면 

- upload.array 형식을 파일을 받는 방식을 선택하는걸로 multer로 하나의 파일만 받을려면 upload.single로 하면된다.

** 위의 공식 링크에 잘 설명 되어잇음 **

- file은 form태그에 name을 동일하게 적어주어야하고 / 5는 여러파일을 받을경우에 한해서 한번에 최대 정해진 숫자 까지 받겠다는거다.

 

 동영상과 이미지 파일을 전송하고 서버에서 콘솔을 찍어보면 

[
  {
    fieldname: 'file',
    originalname: 'bandicam 2020-04-14 02-19-09-648.mp4',
    encoding: '7bit',
    mimetype: 'video/mp4',
    destination: '설정경로',
    filename: 'bandicam 2020-04-14 02-19-09-648.mp4',
    path: '설정경로/bandicam 2020-04-14 02-19-09-648.mp4',
    size: 562341
  },
  {
    fieldname: 'file',
    originalname: 'TEST3.PNG',
    encoding: '7bit',
    mimetype: 'image/png',
    destination: '설정경로',
    filename: 'TEST3.PNG',
    path: '설정경로/TEST3.PNG',
    size: 22842
  }
]

array로 선택했으므로 배열형태로 들어온것을 확인 할 수 있다. 

 

key값의 정보들은 공식 설명서에 찾을 수 있다.