웹개발/spring

28장 스프링에서 지원하는 여러 가지 기능

borabora123 2023. 2. 10. 17:43

1. 다중 파일 업로드하기

1) 파일 준비

 

2) pom.xml : 파일 업로드에 필요한 라이브러리를 설치

<dependency>
	<groupId>commons-fileupload</groupId>
	<artifactId>commons-fileupload</artifactId>
	<version>1.2.1</version>
</dependency>
		
<dependency>
	<groupId>commons-io</groupId>
	<artifactId>commons-io</artifactId>
	<version>1.4</version>
</dependency>

3) servlet-context.xml : CommonsMultipartResolver 클래스를 multipartResolver 빈으로 설정

<beans:bean id="multipartResolver" 
	class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
      <beans:property name="defaultEncoding" value="utf-8" />
</beans:bean>

 

4) 파일 업로드 및 다운로드 기능 컨트롤러를 구현하기 위한 자바 파일들을 준비

5) FileDownloadController.java : 파일 다운로드 컨트롤러, 버퍼 기능을 이용해 빠르게 브라우저로 이미지 파일을 전송

public class FileDownloadController {
	//파일 저장 위치 지정
	private static String CURR_IMAGE_REPO_PATH = "c:\\image_repo";
	
	@RequestMapping("/download") //다운로드할 이미지 파일 이름 전달
	protected void download(@RequestParam("imageFileName") String imageFileName,
			HttpServletResponse response) throws Exception {
		OutputStream out = response.getOutputStream();
		String downFile = CURR_IMAGE_REPO_PATH + "\\" + imageFileName;
		File file = new File(downFile); //다운로드할 파일 객체 생성
		response.setHeader("Cache-Control", "no-cache");
		response.addHeader("Content-disposition", "attachment; fileName=" + imageFileName);
		//헤더에 파일 이름 설정
		FileInputStream in = new FileInputStream(file);
		byte[] buffer = new byte[1024 * 8];
		while(true) { //버퍼를 이용해 한번에 8Kbyte씩 브라우저로 전송
			int count = in.read(buffer);
			if(count == -1) break;
			out.write(buffer, 0, count);
		}
		in.close();
		out.close();
	}

6) 파일 업로드 컨트롤러를 구현합니다.

@Controller
public class FileUploadController {
	private static final String CURR_IMAGE_REPO_PATH = "c:\\image_repo";
	
	@RequestMapping(value="/form")
	public String form() { //업로드창인 uploadForm.jsp를 반환
		return "uploadForm";
	}
	
	@RequestMapping(value="/upload", method = RequestMethod.POST)
	public ModelAndView upload(MultipartHttpServletRequest multipartRequest, 
	HttpServletResponse response) throws Exception {
		multipartRequest.setCharacterEncoding("utf-8");
		Map map = new HashMap(); //매개변수 정보와 파일정보를 저장한 Map 생성
		Enumeration enu = multipartRequest.getParameterNames();
		while(enu.hasMoreElements()) { //전송된 매개변수 값을 key/value로 map에 저장
			String name=(String)enu.nextElement();
			String value=multipartRequest.getParameter(name);
			System.out.println(name+":"+value);
			map.put(name, value);
		}
		
		//파일을 업로드한 후 반환된 파일 이름이 저장된 fileList를 다시 map에 저장
		List fileList = fileProcess(multipartRequest);
		map.put("fileList", fileList);
		ModelAndView mav = new ModelAndView();
		mav.addObject("map", map); //map을 결과창으로 포워딩
		mav.setViewName("result");
		return mav;
	}
	
	private List<String> fileProcess(MultipartHttpServletRequest multipartRequest)
	throws Exception {
		List<String> fileList = new ArrayList<String>();
		//첨부된 파일 이름을 가져옴
		Iterator<String> fileNames = multipartRequest.getFileNames();
		while(fileNames.hasNext()) {
			String fileName = fileNames.next();
			System.out.println("fileName: " + fileName);
			//파일 이름에 대한 MultipartFile 객체를 가져옴
			MultipartFile mFile = multipartRequest.getFile(fileName);
			System.out.println("mfile: " + mFile); 
			
			//실제 파일 이름을 가져옴
			String originalFileName = mFile.getOriginalFilename();
			System.out.println("originalFileName: " + originalFileName);
			fileList.add(originalFileName); //파일 이름을 하나씩 fileList에 저장
			File file = new File(CURR_IMAGE_REPO_PATH+"\\"+fileName);
			
			if(mFile.getSize() != 0) { //첨부된 파일이 있는지 체크
				if(! file.exists()) { //경로에 파일이 없으면 그 경로에 해당하는 디렉토리를 만든 후 파일 생성
					if(file.getParentFile().mkdirs()) {
						file.createNewFile();
					}
				}
				//임시로 저장된 multipartFile을 실제 파일로 전송
				mFile.transferTo(new File(CURR_IMAGE_REPO_PATH+"\\"+originalFileName));
			}
		}
		return fileList; //첨부된 파일 이름이 저장된 fileList를 반환
	}
}

 

7) 파일 업로드창과 업로드한 파일을 표시해 주는 결과창을 나타낼 JSP 파일

8) uploadForm.jsp : 파일 업로드창

<script>
	var cnt=1; /* 파일 업로드 name 값을 다르게 하는 변수 */
	/* 파일 추가를 클릭하면 동적으로 파일 업로드 추가 
	   name 속성의 값으로 'file'+cnt를 설정함으로써 값을 다르게 해줌*/
	function fn_addFile() { 
		$("#d_file").append("<br>"+"<input type='file' name='file"+cnt+"' />");
		cnt++;
		}
</script>

<body>
	<h1>파일 업로드 하기</h1>
	<form method="post" action="${contextPath}/upload" enctype="multipart/form-data">
		<label>아이디:</label>
			<input type="text" name="id"><br>
		<label>이름:</label>
			<input type="text" name="name"><br>
			<input type="file" value="파일추가" onClick="fn_addFile()" /><br>
		<div id="d_file">
		</div>
			<input type="submit" value="업로드" />
	</form>
</body>

9) result.jsp

<form method="post" action="${contextPath}/upload" enctype="multipart/form-data">
	<label>아이디:</label>
		<input type="text" name="id"><br>
	<label>이름:</label>
		<input type="text" name="name"><br>
		<input type="button" value="파일추가" onClick="fn_addFile()" /><br>
		<input type="file" mutiple="multiple" name="files" /><br>
		<input type="file" mutiple="multiple" name="files2" /><br>
	<div id="d_file">
	</div>
		<input type="submit" value="업로드" />
</form>

결과