파일 업로드
일반적으로 사용하는 HTML Form을 통한 파일 업로드를 이해하려면 먼저 폼을 전송하는 다음 두 가지 방식의 차이를 이해해야 한다.
HTML 폼 전송 방식
- application/x-www-form-urlencoded
- multipart/form-data
application/x-www-form-urlencoded 방식
application/x-www-form-urlencoded 방식은 HTML 폼 데이터를 서버로 전송하는 가장 기본적인 방법
Form 태그에 별도의 enctype 옵션이 없으면 웹 브라우저는 요청 HTTP 메시지의 헤더에 다음 내용을 추가한다.
Content-Type: application/x-www-form-urlencoded
그리고 폼에 입력한 전송할 항목을 HTTP Body에 문자로 username=kim&age=20 와 같이 & 로 구분해서 전송한다.
파일을 업로드 하려면 파일은 문자가 아니라 바이너리 데이터를 전송해야 한다. 문자를 전송하는 이 방식으로 파일을 전송하기는 어렵다. 그리고 또 한가지 문제가 더 있는데, 보통 폼을 전송할 때 파일만 전송하는 것이 아니라는 점이다.
예를 들어, 이름과 나이, 첨부 파일 데이터를 Form을 통해 전송해야 하는 상황이면 문제가 발생하는 것이다.
▶ 이 문제를 해결하기 위해 HTTP는 multipart/form-data 라는 전송 방식을 제공한다.
multipart/form-data 방식
multipart/form-data 방식은 다른 종류의 여러 파일과 폼의 내용 함께 전송할 수 있다.
이 방식을 사용하려면 Form 태그에 별도의 enctype="multipart/form-data" 를 지정해야 한다.
폼의 입력 결과로 생성된 HTTP 메시지를 보면 각각의 전송 항목이 구분이 되어있다. Content-Disposition 이라는 항목별 헤더가 추가되어 있고 여기에 부가 정보가 있다.
▶multipart/form-data 는 이렇게 각각의 항목을 구분해서, 한번에 전송하는 것이다.
서블릿 - 파일 업로드
우선, 서블릿을 통한 파일 업로드 방식을 알아보겠다.
예시 코드를 확인해보자
ServletUploadController
@Slf4j
@Controller
@RequestMapping("/servlet/v1")
public class ServletUploadControllerV1 {
@GetMapping("/upload")
public String newFile() {
return "upload-form";
}
@PostMapping("/upload")
public String saveFileV1(HttpServletRequest request) throws ServletException, IOException {
log.info("request={}", request);
String itemName = request.getParameter("itemName");
log.info("itemName={}", itemName);
Collection<Part> parts = request.getParts();
log.info("parts={}", parts);
return "upload-form";
}
}request.getParts(): multipart/form-data 전송 방식에서 각각 나누어진 부분을 받아서 확인할 수 있다.
resources/templates/upload-form.html
<body>
<div class="container">
<div class="py-5 text-center">
<h2>상품 등록 폼</h2>
</div>
<h4 class="mb-3">상품 입력</h4>
<form th:action method="post" enctype="multipart/form-data">
<ul>
<li>상품명 <input type="text" name="itemName"></li>
<li>파일<input type="file" name="file" ></li>
</ul>
<input type="submit"/>
</form>
</div> <!-- /container -->
</body>
결과 로그
Content-Type: multipart/form-data; boundary=----xxxx
------xxxx
Content-Disposition: form-data; name="itemName"
Spring
------xxxx
Content-Disposition: form-data; name="file"; filename="test.data"
Content-Type: application/octet-stream
sdklajkljdf...
멀티파트 사용 옵션
업로드 사이즈 제한
spring.servlet.multipart.max-file-size=1MB
spring.servlet.multipart.max-request-size=10MB
큰 파일을 무제한 업로드하게 둘 수는 없으므로 업로드 사이즈를 제한할 수 있다.
사이즈를 넘으면 예외( SizeLimitExceededException )가 발생한다.
max-file-size : 파일 하나의 최대 사이즈, 기본 1MB
max-request-size : 멀티파트 요청 하나에 여러 파일을 업로드 할 수 있는데, 그 전체 합이다. 기본 10MB
spring.servlet.multipart.enabled 끄기 (기본 true)
spring.servlet.multipart.enabled=false
멀티파트는 일반적인 폼 요청인 application/x-www-form-urlencoded 보다 훨씬 복잡하다.
spring.servlet.multipart.enabled 옵션을 끄면 서블릿 컨테이너는 멀티파트와 관련된 처리를 하지 않는다.
서버에 파일 업로드
서블릿이 제공하는 Part 에 대해 알아보고 실제 파일도 서버에 업로드 해보자.
해당 경로에 실제 폴더를 만들어두자.
그리고 다음에 만들어진 경로를 입력해두자.
application.properties
file.dir = 파일 업로드 경로 설정 (EX) /Users/UserA/study/test/
@Value("${file.dir}")
private String fileDir;위와 같이 사용
멀티파트 형식은 전송 데이터를 하나하나 각각 부분( Part )으로 나누어 전송한다.
parts 에는 이렇게 나누어진 데이터가 각각 담긴다.
서블릿이 제공하는 Part 는 멀티파트 형식을 편리하게 읽을 수 있는 다양한 메서드를 제공한다.
Part 주요 메서드
- part.getSubmittedFileName() : 클라이언트가 전달한 파일명
- part.getInputStream(): Part의 전송 데이터를 읽을 수 있다.
- part.write(...): Part를 통해 전송된 데이터를 저장할 수 있다.
서블릿의 part를 활용한 예시 코드를 확인해보자.
//편의 메서드
//content-disposition; filename
log.info("submittedFileName={}", part.getSubmittedFileName());
log.info("size={}", part.getSize()); //part body size
//데이터 읽기
InputStream inputStream = part.getInputStream();
String body = StreamUtils.copyToString(inputStream, StandardCharsets.UTF_8);
log.info("body={}", body);
//파일에 저장하기
if (StringUtils.hasText(part.getSubmittedFileName())) {
String fullPath = fileDir + part.getSubmittedFileName();
log.info("파일 저장 fullPath={}", fullPath);
part.write(fullPath);
서블릿이 제공하는 Part 는 편하기는 하지만, HttpServletRequest 를 사용해야 하고,
추가로 파일 부분만 구분하려면 여러가지 코드를 넣어야 한다.
반면에, 스프링은 얼마나 편리하게 제공하는지 알아보자.
스프링과 파일 업로드
@PostMapping("/upload")
public String saveFile(@RequestParam String itemName, @RequestParam MultipartFile file) throws IOException {
log.info("itemName={}", itemName);
log.info("multipartFile={}", file);
if (!file.isEmpty()) {
String fullPath = fileDir + file.getOriginalFilename();
log.info("파일 저장 fullPath={}", fullPath);
file.transferTo(new File(fullPath));
}
return "upload-form";
}
업로드하는 HTML Form의 name에 맞추어 @RequestParam 을 적용하면 된다.
추가로 @ModelAttribute 에서 도 MultipartFile 을 동일하게 사용할 수 있다.
MultipartFile 주요 메서드
- file.getOriginalFilename() : 업로드 파일 명
- file.transferTo(...) : 파일 저장
첨부 파일 다운로드
서버에 첨부 파일을 올려 놓고, 이를 사용자가 PC에 해당 파일을 다운로드할 수 있게 하려면 어떻게 해야 할까?
관련 핵심 예시 코드이다.
@GetMapping("/attach/{itemId}")
public ResponseEntity<Resource> downloadAttach(@PathVariable Long itemId) throws MalformedURLException {
Item item = itemRepository.findById(itemId);
String storeFileName = item.getAttachFile().getStoreFileName();
String uploadFileName = item.getAttachFile().getUploadFileName();
UrlResource resource = new UrlResource("file:" + fileStore.getFullPath(storeFileName));
log.info("uploadFileName={}", uploadFileName);
String encodedUploadFileName = UriUtils.encode(uploadFileName, StandardCharsets.UTF_8);
String contentDisposition = "attachment; filename=\"" + encodedUploadFileName + "\"";
return ResponseEntity.ok()
.header(HttpHeaders.CONTENT_DISPOSITION, contentDisposition)
.body(resource);
}@GetMapping("/attach/{itemId}") : 파일을 다운로드 할 때 실행한다. 파일 다운로드 시 권한 체크같은 복잡한 상황까지 가정하고 이미지 id 를 요청하도록 했다.
파일 다운로드시에는 고객이 업로드한 파일 이름으로 다운로드 하는게 좋다.
이때는 Content-Disposition 해더에 attachment; filename="업로드 파일명" 값을 주면 된다.
( UriUtils.encode 를 통해 encodeedUploadFileName으로 바꿔주고 Content-Disposition에 넣어줘야 한국어도 인코딩 됨 )
'Spring' 카테고리의 다른 글
| Spring boot 버전에 맞는 라이브러리 버전 찾기 (0) | 2024.04.02 |
|---|---|
| Spring - Formatter, ConversionService (0) | 2024.01.02 |
| Spring - 타입 컨버터 (Converter, ConversionService) (1) | 2024.01.02 |
| Spring - API 예외 처리 (ExceptionHandler, ControllerAdvice) (2) | 2024.01.01 |
| Spring - API 예외 처리 (HandlerExceptionResolver, ExceptionResolver ) 이론 (2) | 2024.01.01 |