스프링부트 이미지(파일) 업로드 하기

Springboot

스프링부트 이미지(파일) 업로드 하기

열곰탱 2022. 10. 5. 00:31

form태그작성

원래 form태그는 x-www-form-urlencoded타입밖에 전송을 못한다.

key,value타입밖에 전송을 못한다.

하지만 form태그에서 여러가지 타입을 함께 사용할수있다.

x-www-form-urlencoded + input type="file"을 적어줌으로써 파일도 보낼수 있다.

파일을 보낼때 전송타입을 multipart/form-data타입을 사용한다.

enctype의 default 값은 application/x-www-form-urlencoded 이다.

multipart/form-data는 사진이랑 x-www-form-urlencoded 두개를 보낼수있는 전송타입이다.

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<h1>index Page</h1>
<form method="post" action="/upload" enctype="multipart/form-data">
<input type="file" name="file"/>
<button type="submit">파일전송</button>
</form>
</body>
</html>

아래와 같은결과가 나온다.

파일선택을 클릭해서 이미지를 선택하면

파일선택 버튼 옆에 이미지의 이름이 나온다.

파일전송을 누르면 action으로 지정해준 /upload로 이동하게된다.

/upload작성

@ResponseBody - 파일이 저장되고나서 데이터를 리턴해준다.

먼저 데이터를 잘받아오는지 확인을 해본다.

@RequestPart

데이터가 잘들어오는지 확인

	@PostMapping("/upload")
	public @ResponseBody String create(@RequestPart MultipartFile file) {
		return "ok";
	}

파일전송을 누르게 되면 ok라는 데이터가 return이 되었다.

사진을 받은것을 확인해볼수 있다.

그럼 사진을 받았으니, file로 받아서(DB에 넣을지, 서버의 하드디스크에 기록할지 정해줘야한다.)

위랑 똑같은 방식으로 사진을 전송해보면

console창에 이미지 파일의 경로가 나오는 것을 확인할수 있다.

파일의 객체를 만들어준다.

File은 java.io.File을 import해준다.

파일에다가 InputStream을 한다는 것은

내가 만든 파일객체에다가 사용하겠다는 것이다.

하드디스크에 용량이 없어서 오류가 발생할수 있기때문에

try catch문을 사용해준다.

	@PostMapping("/upload")
	public @ResponseBody String create(@RequestPart MultipartFile file) {
		String fileName = file.getOriginalFilename();
		System.out.println("fileName : " + fileName);
		// 사진을 받았는데, file을 받았는데(DB에 넣을지, 서버 하드디스크에 기록할지)
		String filePath = "c:\\upload\\" + fileName;
		System.out.println("filePath:" + filePath);
		// String filePath = path + fileName;

		File dest = new File(filePath);
		try {
			Files.copy(file.getInputStream(), dest.toPath());
		} catch (IOException e) {
			e.printStackTrace();
		}
		return "ok";
	}

코드에서 지정해준 사진을 담을공간인 upload를 만들어준다.