[NodeJS] multer 이해하기

Multer는 Node.js에서 파일 업로드를 처리하는 데 사용되는 미들웨어입니다.

Multer

multer 모듈 설치

Multer를 사용하려면 다음과 같은 단계를 거쳐야 합니다.

npm i multer

multer 설정하기

const storage = multer.diskStorage({
  destination: function (req, file, cb) {
    cb(null, "uploads/");
  },
  filename: function (req, file, cb) {
    cb(null, Date.now() + "-" + file.originalname);
  },
});

위의 코드에서 diskStorage() 함수를 사용하여 파일이 저장될 디렉터리와 파일명을 설정합니다. destination 속성은 파일이 저장될 디렉터리를 설정하고, filename 속성은 파일명을 설정합니다. 이 예제에서는 현재 날짜와 시간을 파일명 앞에 추가하여 중복된 파일명을 방지합니다.

---

multer로 업로드하기

하나의 파일 업로드 multer.single

app.post("/upload", upload.single("uploadfile"), function (req, res) {
  console.log(req.file);
  res.send("File uploaded!");
});

위의 코드에서 /upload 라우트로 POST 요청이 들어오면 upload.single() 함수를 사용하여 파일 업로드를 처리합니다. single() 함수는 하나의 파일만 업로드할 때 사용합니다. 만약 여러 파일을 업로드하려면 array()나 fields() 함수를 사용합니다.

single() 함수의 인자로는 HTML form에서 전송된 파일의 필드명을 지정합니다. 이 예제에서는 uploadfile이라는 필드명으로 파일이 전송되었다고 가정합니다.

위의 코드에서 req.file 객체를 통해 업로드된 파일의 정보를 얻을 수 있습니다. 파일이 제대로 업로드되었는지 확인하려면 req.file 객체를 콘솔에 출력해 보면 됩니다.

 

html 예시

<form action="/upload" method="post" exctype="multipart/form-data">
	<input type="file" name="uploadfile">
</from>

input 태그의 name값이 upload.single의 매개변수와 같아야 합니다.

---

하나의 field에 여러 파일 업로드 multer.array

multer.array() 함수는 하나의 필드에 여러 파일이 업로드될 때 사용합니다. 예를 들어, 여러 개의 이미지 파일을 업로드하는 경우 input 태그의 name 속성을 모두 같게 설정하고 multer.array() 함수에 name 속성을 전달하면 됩니다.

app.post("/upload", upload.array("postPhoto", 3), function (req, res) {
  console.log(req.files);
  res.send("Files uploaded!");
});

위의 예제에서 multer.array() 함수에 postPhoto를 전달하여 input 태그의 name 속성이 postPhoto인 필드에 여러 파일이 업로드되는 것을 처리합니다. 두 번째 인자로는 업로드할 최대 파일 개수를 전달합니다.

위의 코드에서 req.files 객체를 통해 업로드된 파일들의 정보를 얻을 수 있습니다. 여러 개의 파일이 업로드되었는지 확인하려면 req.files 객체를 콘솔에 출력해 보면 됩니다.

html 예시

<form action="/upload" method="post" enctype="multipart/form-data">
	<input type="file" name="postPhoto" multiple/>
</form>

---

여러 field에 여러 파일 업로드 multer.fields

multer.fields() 함수는 여러 필드에 각각 하나의 파일이 업로드될 때 사용합니다. 예를 들어, 프로필 이미지와 사진첩 이미지를 업로드하는 경우 input 태그의 name 속성을 각각 다르게 설정하고 multer.fields() 함수에 필드명과 파일 개수를 객체 형태로 전달하면 됩니다.

app.post(
  "/upload",
  upload.fields([
    { name: "albumcover", maxCount: 1 },
    { name: "music", maxCount: 3 },
  ]),
  function (req, res) {
    console.log(req.files);
    res.send("Files uploaded!");
  }
);

위의 예제에서 multer.fields() 함수에 배열로 업로드할 파일의 정보를 전달하며 각각의 요소는 객체로 전달합니다. 객체의 name의 값으로 input 태그의 name 속성이 albumcover와 music, maxCount의 값으로 파일의 최대 개수를 설정하여 필드에 여러 파일이 업로드되는 것을 처리합니다.

위의 코드에서 req.files 객체를 통해 업로드된 파일들의 정보를 얻을 수 있습니다. 여러 개의 파일이 업로드되었는지 확인하려면 req.files 객체를 콘솔에 출력해 보면 됩니다.

html 예시

<form action="/upload" type="post" enctype="multipart/form-data">
	<input type="file" name="albumcover"/>
	<input type="file" name="music" multiple/>
</form>

---

파일 형식에 따른 분류

 const fileFilter = (req,file,cb) => {
     if(file.mimetype === 'image/png' || file.mimetype === 'image/jpg' || file.mimetype === 'image/jpeg'){
         cb(null,true);
     }
     else{
         cb(null,false);
     }
 };

위의 코드와 같이 mimetype을 통하여 파일의 형식과 확장자를 분류 할 수 있습니다. 여기서 mimetype이란 인터넷에 전달되는 파일 포맷과 포맷 콘텐츠를 위한 식별자를 의미합니다.