filefilter 기능을 사용하자(에러처리)

multer와 multer-s3를 이용해서 게시판에 이미지를 올릴 수 있도록 설정하였는데, 동작은 정상적으로 작동하였다.

일주일만에 하나의 프로젝트를 만드는데 조금 벅찬 감이 있었는지 주로 정상적인 동작이 되는지를 검사했었고,

다행이도 이미지파일이 잘 업로드 되는 것을 확인할 수 있었다.

그런데 게시글을 작성에 파일을 업로드 하면서 의도치 않은 예외경우가 발생했다.

파일을 실수로 txt파일을 클릭해서 게시글을 작성하였는데, 에러가 발생하거나 무효처리가 되지 않고, 그대로 S3에 저장되는 것이다.

multer를 사용하면서 내가 잘못 생각한 것은, 이 라이브러리는 이미지파일 전송을 위한 것이 아니라 대용량 파일전송에 필요한 것이고, 따로 이미지 파일만을 분류해서 받을 수 있도록 처리해야할 필요성이 있었다.

multer 라이브러리에는 파일을 분류할 수 있는 filefiter함수를 내장하고 있다.

multer github readme에서 아래와 같은 사용법을 찾을 수 있다.

function fileFilter (req, file, cb) {

  // The function should call `cb` with a boolean
  // to indicate if the file should be accepted

  // To reject this file pass `false`, like so:
  cb(null, false)

  // To accept the file pass `true`, like so:
  cb(null, true)

  // You can always pass an error if something goes wrong:
  cb(new Error('I don\'t have a clue!'))

}

사용법을 보고 의문이 들었다. 왜 거부하고 나서는 에러에 대한 처리를 하지않는 걸까? 따지고보면 filtering이라는 것은 결국 validation과 같은것 아닌가?

그렇다면 이미지면 통과시키고, 이미지가 아니면 에러를 보내주면 되지 않을까? 해서 새롭게 filfilter를 적용했다.

fileFilter: (req: Request, file: Express.Multer.File, callback: multer.FileFilterCallback) => {
    const filenameExtension = file.originalname.split('.')[file.originalname.split('.').length - 1];
    if (
      filenameExtension === 'jpg' ||
      filenameExtension === 'png' ||
      filenameExtension === 'jpeg' ||
      filenameExtension === 'gif' ||
      filenameExtension === 'bmp' ||
      filenameExtension === 'tiff'
    ) {
      callback(null, true);
    } else {
      callback(badRequest('이미지 형식이 아님'));
    }
  },

대표적인 이미지파일에 대한 확장자를 따와서 그것과 일치하지 않는 다면 모두 에러처리를 하게 끔 변경하였다. 일시적인 방편이지만 이미지와 이미지가 아닌 것을 구분 할 수 있는 방법이라 생각되었다.

다만, 이미지의 유무를 분간하는 중에 다른 알 수 없는 에러가 발생한다면, 이에 대한 처리를 못한게 아쉽긴하다.