[스트링부트]Multipart 파일 전송

스트링부트 적용 코드

1. Entity 정의

• 파일 정보와 사용자 정보를 저장할 엔티티 생성.

@Entity
@Table(name = "upload_tb")
public class Upload {
    @Id
    @GeneratedValue(strategy = GenerationType.IDENTITY)
    private Integer id; // id는 필수
    private String username;
    private String profileUrl;

    @Builder
    public Upload(Integer id, String username, String profileUrl) {
        this.id = id;
        this.username = username;
        this.profileUrl = profileUrl;
    }
}

2. HTML Form 작성

• multipart/form-data를 설정하여 파일과 텍스트 데이터를 전송. name 속성은 폼 데이터 서버 전송시, 데이터를 식별하는 키(key).

<form action="/v1/upload" method="post" enctype="multipart/form-data">
    <input type="text" name="username"> <br>
    <input type="file" name="img"> <br>
    <button type="submit">전송</button>
</form>

3. DTO 생성

• 파일 전송 시 데이터를 매핑하기 위한 DTO 생성.

@Data
public static class V1DTO {
    private String username;
    private MultipartFile img;

    public Upload toEntity(String profileUrl) {
        return Upload.builder()
                     .username(username)
                     .profileUrl(profileUrl)
                     .build();
    }
}

4. Service 구현

• 파일 저장과 DB 저장 로직을 처리.

• UUID을 활용하여 동일한 이름의 파일 업로드 충돌 방지.

  	@Transactional
    public void v1사진저장(UploadRequest.V1DTO v1DTO) {
        String imgName = UUID.randomUUID() + "_" + v1DTO.getImg().getOriginalFilename();
        String profileUrl = "images/" + imgName;
        String dbUrl = "/upload/" + imgName;

        try {
            Path path = Paths.get(profileUrl);
            Files.write(path, v1DTO.getImg().getBytes());
            uploadRepository.save(v1DTO.toEntity(dbUrl));
        } catch (IOException e) {
            throw new RuntimeException(e.getMessage());
        }
    }

    public Upload v1사진보기() {
        return uploadRepository.findById(1);
    }
}

5. 리소스 매핑 설정

• 저장된 파일을 외부 접근 가능하게 리소스 핸들러 등록.

@Configuration
public class WebConfig implements WebMvcConfigurer {
    @Override
    public void addResourceHandlers(ResourceHandlerRegistry registry) {
        registry.addResourceHandler("/upload/**")
                .addResourceLocations("file:" + "./images/")
                .setCachePeriod(3600);
    }
}

6. 사진 확인 HTML

• 업로드된 사진 정보를 표시.

<h1>{{model.username}}</h1>
<img src="{{model.profileUrl}}">

화면

사용 기능

1. UUID (Universally Unique Identifier)

• 분산 시스템에서 고유한 식별자 생성에 사용

• 특징
1. 128비트로 구성된 식별자

f47ac10b-58cc-4372-a567-0e02b2c3d479

2. 충돌 가능성 낮음: 동일한 UUID가 생성될 가능성은 매우 낮아, 파일 이름, 데이터베이스 키 등 고유성이 중요한 곳에 사용
3. 자체 생성 가능: 네트워크 연결 없이 로컬에 생성 가능

• 사용방식

String imgName = UUID.randomUUID() + "_" + v1DTO.getImg().getOriginalFilename();

• UUID.randomUUID()
• 새로 고유한 UUID를 생성. 항상 새로운 값이 반환되며, 충돌할 가능성은 거의 없음.
• getOriginalFilename()
• 업로드된 파일의 원래 이름을 가져와서 UUID와 결합한 고유한 파일 이름을 만듬