nodejs - multer를 이용하여 이미지 업로드 구현하기

김예지·2021년 8월 9일
0

우리 서비스에는 선거 기능이 존재한다.
기존 한인회장 선거가 구글 독스 등의 루트로 이루어졌기 때문에, 이 부분을 우리 서비스에서 보완할 수 있겠다 싶어 결정하게 되었고, 각 후보자의 사진을 등록할 수 있는 기능이 필요했다.
multer를 이용하여 구현한 코드는 다음과 같다.

const multer = require("multer");
const randomstring = require("randomstring");

const imageUpload = multer({
  storage: multer.diskStorage({
    destination: (req, file, cb) => {
      cb(null, `${__dirname}/../public`); //저장할 폴더
    },
    filename: (req, file, cb) => {
      var fileName = randomstring.generate(25); // 파일 이름 - 랜덤
      var mimeType;
      switch (
        file.mimetype // 파일 타입
      ) {
        case "image/jpeg":
          mimeType = "jpg";
          break;
        case "image/png":
          mimeType = "png";
          break;
        case "image/gif":
          mimeType = "gif";
          break;
        case "image/bmp":
          mimeType = "bmp";
          break;
        default:
          mimeType = "jpg";
          break;
      }
      cb(null, fileName + "." + mimeType); // 파일 이름 + 파일 타입 형태로 이름 설정
    },
  }),
  limits: {
    fileSize: 5 * 1024 * 1024, // 크기제한 : 5byte
  },
});


router.post("/", authMiddleware, imageUpload.array("img"), async (req, res) => {
  const { user_id } = res.locals.user;
  const { name, content, univ_id, candidates, end_date, start_date } = req.body;
  //각종 예외처리 생략
  
    const createdElection = await election.create({
      name,
      content,
      country_id,
      univ_id,
      start_date,
      end_date,
    });
    let i = 0;
    candidates.forEach(function (c) {
      c.election_id = createdElection.election_id;
      c.photo = req.files[i].filename;
      i += 1;
    });
    await candidate.bulkCreate(candidates);

테스트는 포스트맨에서 이렇게 가능하다.

key input box의 오른쪽에 마우스를 갖다대면, 키 타입을 파일로 지정할 수 있다. insomnia에서는 파일배열이 지정이 되지 않지만, postman에서는 파일배열이 가능하다.

디비에는 이런 형식으로 저장된다.

다만, 가독성을 위해 추후 폴더 경로는 수정해주도록 하자.

profile
새싹

0개의 댓글