TIL #032

오늘 한 것

정보처리기사 ✍️

• UI

Bookstack 📚

[ 관련 레포지토리 ] BookStack-FE,  BookStack-BE

• Book Image 추가 기능 구현
• Book Image 스택 페이지 반영
• Book Image 상세 페이지 반영
• 전체 페이지 CSS 변경
• 빌드 테스트
• pull request 생성 및 dev로 merge

오늘 배운 것

Express(Node.js) 프로젝트에서 S3에 이미지 저장한 후 프론트로 이미지 url 반환해주기

1. AWS IAM 사용자 생성

• 액세스 유형 : 프로그래밍 방식 액세스
• 권한 설정 : AmazonFullAccess
• 액세스 키 설정 ⇒ 생성된 액세스 키와 비밀 액세스 키는 따로 저장

2. Bucket 생성

• 객체 소유권 : ‘ACL 활성화됨’으로 설정

3. 필요 모듈 설치

• multer
• multer-s3
• aws-SDK

4. multer.upload 설정

const multer = require("multer");
const multerS3 = require("multer-s3");
const aws = require("aws-sdk");

// 액서스 키와 비밀 액서스 키는 보안문제로 인해 환경변수 등에 따로 저장해 둘 것을 권장
aws.config.update({
  accessKeyId: '당신의_액서스_키', // 과정 1에서의 액서스 키
  secretAccessKey: '당신의_비밀_액서스_키', // 과정 1에서의 비밀액서스 키
  region: "ap-northeast-2", // 영역. 한국은 ap-northeast-2로 설정
});

const s3 = new aws.S3();

const upload = multer({
  storage: multerS3({
    s3: s3,
    bucket: "당신의_버킷_이름",
    acl: "public-read",
    key: function (req, file, cb) {
      cb(null, `${Date.now()}_${file.originalname}`);
    },
  }),
  limits: { fileSize: 5 * 1024 * 1024 }, // 추가 설정 (필수 X)
});

module.exports = upload; // export시 upload 메서드로 사용 가능

 

5. router 설정

const express = require("express");
const router = express.Router();
const upload = require("../modules/multer");
const { uploadImage } = require("../controller/image"); //upload 완료 후 실행될 콜백함수

router.post("/upload", upload.single("image"), uploadImage);

module.exports = router;

 

오늘의 에러

The bucket does not allow ACLs (Service: Amazon S3; Status Code: 400; Error Code: AccessControlListNotSupported

해결

bucket의 객체 소유권 부여

관련 문서 :

https://fun-coding-study.tistory.com/324

 

오늘의 느낀 점

정보처리기사 공부가 본격적으로 시작되고 있다. 오늘 UI 공부는 비교적 쉬웠지만, 어제 공부했던 플랫폼, UML 등의 개념은 복습해도 어렵다. 이렇게 이론적인 것들에 대해 배우니 컴퓨터 공학을 더 배우고 싶다는 욕심이 든다. 계획했던 대로 진행해 끝까지 잘 마무리해서 이번 필기 시험에 통과할 수 있길 : )

 

오늘 AWS S3와 multer를 이용하여 백엔드(Node.js)에서의 이미지 저장 기능을 구현했다. 버킷, IAM 등 AWS 관련 용어들과 multer 라이브러리 들을 처음 접해 처음 2시간 정도는 헤맸지만 다행히 잘 마무리 할 수 있었다. AWS S3 버킷 생성과 multer 라이브러리 사용 방법에 대해선 많은 문서들이 존재했지만, IAM 설정 등에 대해서 잘 설명되어 있는 문서는 거의 찾아볼 수 없었다. 덕분에 몇몇 에러들로 인해 엄청 해멨다. 이번주 주말에 나와 같이 헤매는 분에게 도움이 될 수 있도록 제대로 정리해 본 문서를 작성 해 볼 계획이다.

(저 같은 사람 또 없게 해주세요)