웹 페이지를 만들 때, 사진에서 엑박 생기는 이유와 UUIID 사용해서 이미지 이름 지정

웹 페이지를 만들 때, 사진을 업로드하면 사진에 엑박이 생길 때가 있다. 이유는 무엇일까?

 

1. Upload 파일을 프로젝트 내부에 만들 경우

먼저 서버를 실행하게 되면 서버는 요청에 맞는 코드를 찾아 컴파일을 실행한다.

요청한 것을 찾은 컴파일은 배포 즉, 실행하기 위해 Target라는 폴더안에 있는 .class 또는 .정적파일로 실행한다.

 

 

!!!! 여기서 Target이란?

Target 폴더는 Java와 같은 프로그래밍 언어에서 Maven, Gradle과 같은 빌드 도구를 사용할 때, 일반적으로 프로젝트 디렉토리를 생성하는 폴더 중 하나이다.

예를 들어, Maven은 소스 코드를 컴파일하고 패키징하며, 테스트를 실행하고 결과물을 생성하는 등의 작업을 수행한다. 이러한 작업을 수행하면서 생성된 결과물들은 일반적으로 "Target"이라는 폴더에 저장된다. 이 폴더에는 컴파일된 클래스 파일, JAR 또는 WAR 파일, 테스트 결과 리포드 등이 포함된다.

(이 폴더는 보통 빌드 프로세스에서 생성되므로 버전 관리 시스템(Git)에서 일반적으로 무시한다...

 

 

위의 내용을 바탕으로 사용자가 해당 프로젝트에서 이미지를 업로드 한다면,이미지가 Target 안에 들어가게 된다.  

예를 들어, 위의 그림처럼 업로드를 요청하면 프로젝트 안에 있는 이미지 업로드 폴더를 찾아 배포를 하는데 이때 걸리는 시간은 1초가 걸리다. 그리고 프로젝트 내부에서 있는 다른 코드들이 실행되고 웹 페이지에 전송되는 시간은 0.5초가 걸린다. 시간 차가 발생한다. 

이렇게 되면, 사진 업로드하기 위한 파일을 찾고 배포하기 위해 Target 내부에 들어가는데, 그 전에 시간이 좀 더 빠른 다른 것들이 웹 페이지에 먼저 배포가 된다. 

이때 시간 차가 생기게 되기 때문에 이미지가 나오지 않고 엑박이 생기는 것이다. 

 

 

2. Upload 파일을 프로젝트 외부에 만들 경우

Upload 파일을 프로젝트가 아닌 외부에 폴더를 만들면, Target 를 걸치지 않기 때문에 시간차가 발생하지 않는다. 

 

따라서, 이미지나, 파일같은 것들은 프로젝트 내부에 두지 않고 외부에 만든다. 

 

 

3. UUID 사용해서 이미지 이름 생성하는 이유

위의 그림과 같이 1.jpg의 사진을 업로드 해서 DB에 사진이 저장된 경로를 저장한다. 그리고 사용자가 다른 사진의 1.jpg라는 이름을 가진 사진을 업로드하게 된다면, 중복이 발생해 기존의 업로드한 사진 위에 덮어씌우게 된다.

 

따라서 UUID 이라는 범용 고유 식별자를 이용해서 중복을 방지한다. 이를 통해 사용자가 동시에 이미지를 업로드하거나, 같은 이름을 사용해 업로드하더라도 각 이미지에 대해 충돌 없이 고유한 이름을 부여할 수 있다.

또한 서비스 간에 충돌 또한 방지할 수 있고, 관리가 용이하다.

UUID는 대부분의 데이터베이스에서 인덱스로 사용될 때 랜덤성과 고유성을 제고하여 데이터 검색 및 관리를 효율적으로 할 수 있도록 도와준다.

 

UUID를 사용하면 중복을 예방할 수 있지만, 아주 낮은 확률로 중복이 발생할 수도 있다. 

@Value("${file.path}") //application.yml에 지정한 file path를 의미
private String uploadFolder;

UUID uuid = UUID.radomUUID; //uuid 랜덤지정
String imageFileName = uuid+"_"+imageUploadDto.getFile().getOriginalFilename();

Path imageFilePath = Paths.Paths.get(uploadFolder + imageFileName);

(위의 코드는 일부만 작성한 것.)

 

이미지파일이름을 UUID와 기존의 사진 이미지의 이름을 더해줘 아주 낮은 확률의 중복을 예방할 수 있다.

 

 

 

 

<== 사진처럼 같은 사진이라도 업로드할 때마다 발생하는 UUID의 값이 다르다.