multer

ClassBinu·2024년 4월 4일

Node.js 교과서

목록 보기
12/19

multer는 어려우니까 따로 정리함.

multer

이미지, 동영상 등 여러 파일을 멀티파트 형식으로 업로드할 때 사용하는 미들웨어
멀티파트: enctype이 multipart/form-data인 경우

폼을 통해 업로드된 파일은 body-parser로 처리할 수 없음.
직접 파싱도 안 됨.
그래서 multer 미들웨어를 사용함.

단일 파일 업로드

html

<form enctype="multipart/form-data">
  <input type="file" name="image" />
</form>

기본 구조

const multer = require("multer");

const upload = multer({
  storage: multer.diskStorage({
    destination(req, file, done) {
      done(null, "uploads/");
    },
    filename(req, file, done) {
      const ext = path.extname(file.originalname);
      done(null, path.basename(file.originalname, ext) + Date.now() + ext);
    },
  }),
  limits: { fileSize: 5 * 1024 * 1024 },
});

미들웨어

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

라우터 미들웨어 앞에 multer 미들웨어를 넣으면,
req.file 객체가 생성되고 그 안에 파일이 들어감.
req.body에는 title이 들어감.

req.file 예시

{
  fieldname: 'img',
  originalname: 'node.png',
  encoding: '7bit',
  mimetype: 'image/png',
  destination: 'uploads/',
  filename: 'nodejs3984398934.png',
  path: 'uploads\\node9843984.png',
  size: 44523
}

여러 파일 업로드

html

<form enctype="multipart/form-data">
  <input type="file" name="many" multiple />
</form>

미들웨어

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

결과는 req.files 배열에 들어감.

input 태그가 다른 경우는 fileds 미들웨어 사용

(html input에 각각 name이 지정)

app.post(
  "/upload",
  upload.fields([{ name: "image1" }, { name: "image2" }]),
  (req, res) => {
    console.log(req.files, req.body);
    res.send("ok");
  }
);

req.files.image1, req.files.image2에 각각 들어감.

multipart 정리

1. 단일 파일 업로드

미들웨어 single: req.file

2. 다중 파일 업로드

  • array
  • fields
    둘다 req.files

3. 첨부 파일 없음

none: req.file은 생성 안 됨. req.body만 있음.

0개의 댓글