HomeAboutMeBlogGuest
© 2025 Sejin Cha. All rights reserved.
Built with Next.js, deployed on Vercel
♥️
2기 최종 프로젝트 팀별 공간
/
🌳
[팀 05] Forest
/
💨
화이트보드 지우개
/
🖼️
이미지 업로드 전략(AWS S3 관련)
🖼️

이미지 업로드 전략(AWS S3 관련)

 
💡
Bob : S3를 활용한 이미지 업로드 전략을 프론트-백 모두 살펴보고 결정해야 할 것 같습니다!

이미지 업로드 전략

1. 브라우저 → S3

브라우저에서 Amazon S3 S3로 사진 업로드
이AWS SDK for JavaScript버전 3 (v3) 은 모듈 식 아키텍처를 포함한 몇 가지 훌륭한 새 기능으로 v2를 다시 작성했습니다. 자세한 내용은 단원을 참조하십시오. AWS SDK for JavaScriptv3 개발자 안내서. 기계 번역으로 제공되는 번역입니다. 제공된 번역과 원본 영어의 내용이 상충하는 경우에는 영어 버전이 우선합니다. 이 브라우저 스크립트 코드 예제는 다음을 보여 줍니다.
브라우저에서 Amazon S3 S3로 사진 업로드
https://docs.aws.amazon.com/ko_kr/sdk-for-javascript/v2/developer-guide/s3-example-photo-album.html
브라우저와 S3에 직접 이미지 업로드
저장이 성공할 경우 브라우저는 S3로 부터 저장된 이미지의 URL endpoint만 받아서 서버에 전송한다.
장점 : 백엔드 성능에 부담이 되지 않는다.
단점 : 프론트 코드 유지보수 비용, 이미지에 대한 검증 체계 미비, 암호화 문제
access key , secret key를 프론트 엔드 서버에 환경 변수로 보관해야 하는데 비용이 든다.
이미지 업로드를 취소했을 때 호출하는 delete 로직?
사진 업로드 api가 털리면? s3 요금 폭탄
 

2. 브라우저 → 서버 → S3 ✅

브라우저에서 서버에 이미지 업로드
서버가 이미지를 s3에 업로드하고 url을 받아와서 db에 저장한다.
 
장점 : 프론트 서버 로직 간결화(url만 보내면 되니까), 이미지 검증
단점 : 백엔드 성능 저하(이미지 업로드 무거움), 백엔드 코드 유지보수 비용
의미있는 검증을 해야한다.