AWS IAM, S3, 에디터를 이용하여 이미지 업로드(2)

우선 아마존 홈페이지 에 들어가 S3 bucket을 만들어준다.

버켓 생성과 설정방법은 나중에 글로 정리를 해놓을 예정이다.

server

IAM과 S3 bucket 설정만 하면 서버부분은 정말 간단하다.

이미지 업로드를 하기위해 multer, multer-s3, aws-sdk를 사용하였으며 저장되는 파일 이름을 설정하기 위해 path를 사용하였다.

const { Router } = require("express");
const multer = require("multer");
const multerS3 = require("multer-s3");
const path = require("path");
const AWS = require("aws-sdk");

const router = Router();

const s3 = new AWS.S3({
  accessKeyId: process.env.AWS_KEY,
  secretAccessKey: process.env.AWS_P_KEY,
  //발급받은 키와 비밀번호 입력
});

const uploadS3 = multer({
  //업로드설정
  storage: multerS3({
    s3,
    bucket: "symmbucket/upload", //버켓 폴더 경로
    region: "ap-northeast-2", // 설정해놓은 지역
    key(req, file, cb) {
      const ex = path.extname(file.originalname); //파일이름 안겹치게해주기위해 파일의 이름은 오리지널 이름으로한다
      const base = path.basename(file.originalname, ex);
      cb(null, base + new Date().valueOf() + ex);
    },
  }),
  limits: { fileSize: 100 * 1024 * 1024 }, //파일 사이즈(100mb제한)
});

router.post("/image", uploadS3.array("upload", 10), async (req, res, next) => {
  //한번에 10장까지 업로드 가능
  console.log(req.files.map((v) => v.location));
  try {
    return res.json({ uploaded: true, url: req.files.map((v) => v.location) });
  } catch (error) {
    console.log(error);
    res.json({ upload: false, url: null });
  }
});

module.exports = router;

미리 만들어 놓은 에디터에 테스트라는 파일명의 이미지를 업로드 해보았다

S3 bucket에 파일명과 중복방지를 위한 숫자와 함께 잘 들어온걸 확인 할 수 있다!