Image upload Process

김루루룽·2022년 8월 5일
0

blog✏️

목록 보기
27/61
post-thumbnail

이미지 업로드시 주의해야할 사항

  • 프런트 엔드에 이미지 표시
  • 사용자에게 이미지 다운로드 권한 부여
  • 확장 가능한 방식으로 서버에 이미지 업로드
  • 이미지 데이터 검증
  • 이미지 처리, 자르기, 최적화 및 기타 작업 수행
  • 배너 및 썸네일과 같은 이미지 변형 만들기
  • 이미지 저장
  • 이미지 업로드 하는 모든 레코드에 이미지 연결.

이미지 업로드는 서버 충돌이나 시간이 걸리는 작업이다.
사용자가 10MB의 이미지를 업로드 하려면 리소스 사용량이 많다.
이미지를 업로드하는 사용자가 적다면 문제가 되지 않지만 인원이 많아지면 제어할 수 없게된다.

이미지 업로드 프로세스

1단계 : 클라이언트가 서버에서 업로드 URL 업로드 요청(Request)

이 단계에서 서버는 다음과 같은 임의의 URL을 생성할 수 있다.

  • 시간 제한
  • 검증
  • 인증 확인

인증 확인을 수행한 후 서버는 데이터 베이스에 다음과 같은 데이터와 함께 개별로 이미지 업로드를 추적하는 레코드를 생성한다

  • 파일 이름
  • 파일의 종류
  • 파일의 URL
  • 상태 (requested, uploaded, processed)
  • 이미지의 연결
  • 이미지 연결의 종류 (banner, avatar)
  • 쓰기 토큰 (이미지 수정을 위한)
  • 읽기 토큰 (이미지를 읽기 위한)

서버는 이 데이터를 클라이언트에 반환한다.

2단계 : 클라이언트가 이미지 데이터를 업로드 URL에 업로드한다(UPLOAD)

서버에서 업로드 URL로 무장한 클라이언트는 해당 URL에 대해 POST 요청을 수행합니다. 그런 다음 해당 서비스는 해당 데이터를 수락하고 저장한다

3단계 : 클라이언트가 서버에 업로드가 완료되었음을 알린다 (CONFIRM)

클라이언트는 서버에 이전에 반환된 토큰으로 서버에 요청을 보내 업로드가 완료되었음을 서버에 알린다.

4단계 : 서버가 백그라운드에서 이미지 처리 (PROCESS)

서버는 토큰을 확인한 다음 해당 업로드 요청을 확인한다.
웹 서버에 대한 요청을 차단하지 않고 파일 무결성 확인, 변형 생성, 최적화 수행 등 이미지를 처리하는 작업을 시작

5단계 : 클라이언트가 이미지 처리 상태 확인 (CHECK)

클라이언트는 처리가 완료되었는지 확인하기 위해 때때로 다시 확인해야한다.

6단계 : 서버가 이미지 처리를 완료하고 클라이언트에 알린다 (FINALIZE)

서버는 이미지 URL을 반환할 것이다.
이제 클라이언트는 이미지를 자유롭게 사용할 수 있다.


참조 :
How to Design Software — Image Uploaders

profile
1day 1push..plz

0개의 댓글