기대 효과

• Multipart Form Data를 활용한 이미지 처리 방법
• AWS S3를 활용한 클라우드 스토리지 사용 방법
• 실제 이미지 업로드와 관련된 프론트-백엔드 통신 과정

Multipart Form Data

1. 프론트엔드에서 이미지 파일 선택
2. Multipart Form Data로 서버에 전송
3. 서버에서 파일을 저장하고 URL 반환
4. 반환된 URL로 이미지 표시

POST {{domain}}/api/images/upload

Content-Type: multipart/form-data
// Form Data
"image": File

// Response
{
  "imageUrl": "<http://your-domain.com/images/example.jpg>"
}

S3 Bucket 방식

1. 프론트엔드에서 이미지 파일 선택
2. 서버에서 S3 Pre-signed URL 발급
3. Pre-signed URL을 통해 S3에 직접 업로드
4. 업로드된 이미지 URL 사용

# Pre-signed URL 요청
GET {{domain}}/api/images/s3/upload
Content-Type: application/json

// Response
{
  "preSignedURL" : "www.s3-bucket.com/~~"
}

사용 방법

1. Edit Base URL 버튼을 클릭하여 서버 URL 등록