spring framework ajax 파일 업로드, 다중업로드

ajax로 파일 업로드, 다중 업로드시 FormData 객체가 필요하다.

단, 구버전 IE 에서는 jquery.form.js 을 사용해야 한다.



ajaxUpload.jsp


전송하기 버튼을 눌렀을 때 fileSubmit() 에서 ajax로 전송하게 된다.

이 때 핵심은 var formData = new FormData($("#fileForm")[0]);




FileUploadController.java

하나의 파일에서 모두 보여주기 위해 Controller에 업로드 관련코드를 모두 넣음


ajaxUpload.jsp 에 맞게 매핑해주고, 업로드 된 파일과 

MultipartHttpServletRequest, MultipartFile 로 다중 업로드된 파일을 처리한다.




파일 2개와 id, pw를 입력한 후 전송하기 버튼을 누르면

파일 업로드하였다는 메시지가 뜸




이클립스 콘솔창에도 실제 파일 이름과, 입력한 id, pw 값을 확인할 수 있다.



또한 Controller 에서 설정한 경로로 파일이 업로드 된 것도 확인가능하다.


위 코드를 그대로 사용하게 되면 업로드 된 파일은

C:\Users\사용자 이름\워크스페이스 경로\.metadata\.plugins\org.eclipse.wst.server.core\tmp0\wtpwebapps\프로젝트명\resources\upload

위 경로에서 확인 가능~



댓글

Designed by JB FACTORY