분류 전체보기
-
[파일업로드] 업로드한 파일 다운로드 처리파일업로드 2016. 9. 12. 14:48
파일을 업로드 한 뒤에는 이를 다운받을 수 있는 링크를 제공하고 서버에서는 링크를 통한 다운로드 요청에 대해 처리를 해줘야 한다. 클라이언트에서는 아래와 같은 코드를 넣어서 다운로드 링크를 만들 수 있다. 의 src 에 displayFile 이라는 요청을 보내게 설정된 코드이다. 물음표 이후로 파일정보에 대한 query string 이 들어간다. 12345678910111213141516171819202122232425262728293031 $.ajax({ url: '/uploadAjax', data: formData, dataType: 'text', processData: false, contentType: false, //contentType: 'multipart/form-data', type: 'P..
-
[파일업로드] 서버에서의 처리파일업로드 2016. 9. 12. 14:25
이나 Ajax 방식으로 클라이언트에서 서버로 파일을 전송하는 방법을 살펴봤다. 이를 서버에서 받으려면 몇가지 설정과 코드가 필요하다. 파일 업로드를 위한 라이브러리를 추가한다. pom.xml 1 2 3 4 5 commons-fileupload commons-fileupload 1.3.1 Colored by Color Scripter cs context 에 multipart 로 들어오는 데이터 처리를 위한 설정을 추가한다. 이는 servlet-context 에 추가하면 되는데, 없다면 root-context 에 추가한다. servlet-context.xml 1 2 3 4 Colored by Color Scripter cs 한글 파일 이름 처리를 위해 filter 를 추가한다. web.xml 1 2 3 4 ..
-
[파일업로드] Ajax 방식파일업로드 2016. 9. 11. 16:05
파일업로드 Ajax 방식의 핵심은 FormData 라는 브라우저에서 지원하는 클래스이다. FormData 는 과 같은 효과를 가져다주는 key/value 가 저장되는 객체이다. 태그처럼 데이터를 처리할 수 있게 해준다. 이를 XHR 에 실어서 서버에 보내면 마치 이 전송된 것과 같은 효과를 가져다 준다. IE 에서는 10 부터 지원한다고 한다. (참고) 사용자가 선택한 File 을 아래와 같이 FormData 에 추가할 수 있다. 검색해보니 좋은 예제가 있어 복사했다. (출처는 여기) 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 $('drag-target-selector').on('drop', function(event) { //stop the browser..
-
[파일업로드] <form> 방식파일업로드 2016. 9. 11. 13:54
사용자로부터 입력받은 파일을 서버로 보내는 방법은 크게 두가지가 있다. 태그를 이용한 전송과 Ajax 방식이다. 방식은 태그를 이용하여 사용자로부터 파일을 선택하게 하고 form.submit() 을 통해 서버로 전송하는 방식이다. Ajax 방식은 사용자가 선택한 파일을 XMLHttpRequest 에 실어서 서버에 보내는 방식이다. 이 포스팅에서는 을 사용하는 방식을 다뤄본다. 1 2 3 4 Colored by Color Scripter cs 파일 전송을 위한 의 모양은 대략 위와 같다. 화면상에는 아래와 같이 나온다. 파일전송 form 에서 주의해서 설정해야할 attribute 는 바로 entype 이다. w3schools 에는 아래와 같이 설명이 나온다. enctype attribute 가 가질 수 있..
-
[파일업로드] MIME파일업로드 2016. 9. 10. 13:22
파일업로드를 구현하려고 할 때 가장 먼저 부딪히는 단어가 MIME 이다. MIME 는 Multipurpose Internet Mail Extension 으로 메일전송시 정보의 형태를 나타내는 규격이었는데, 현재 HTTP 프로토콜에서도 사용되고 있다. (위키) 전송하는 데이터의 형태를 "Content-Type" 이라는 헤더에 약속된 타입 값을 넣는 것으로 표현해야 한다. Form 이나 Ajax 통신시 아래와 같이 지정하는 것을 볼 수 있다. (multipart/form-data, application/json) 1 2 3 4 Colored by Color Scripter cs 1 2 3 4 5 6 7 8 $.ajax({ type : 'post', url : '/replies/', headers : { "C..
-
slf4j 로그가 안나올 때서버 2016. 8. 25. 21:35
slf4j 라이브러리로 설정한 Logger 를 통해 로그를 출력했는데, 이클립스 콘솔창에서 메시지가 출력되지 않았다. System.out.println() 으로 출력한 문구는 콘솔에 나오는 상황. slf4j의 설정을 통해 문제를 해결할 수 있다. Logger 관련 코드 일부 1 2 3 4 5 6 7 private static final Logger logger = LoggerFactory.getLogger(UploadController.class); @RequestMapping(value = "/uploadForm", method = RequestMethod.GET) public void uploadForm() { logger.info("GET uploadForm"); System.out.println(..
-
이클립스에서 xml 파일 열 때 텍스트 에디터로 설정IDE 2016. 8. 20. 11:44
Eclipse 에서 pom.xml 을 열면 Maven POM Editor 가 뜨면서 설정을 하도록 되어 있다. 나는 이게 더 알아보기 힘들고 명확하지 않다고 생각해서 xml 코드를 직접 수정하는 것을 선호한다. 이클립스에서 설정하는 방법은 아래와 같다. * Maven POM Editor 로 열린 pom.xml * XML Editor 로 열린 pom.xml 이클립스 - window - preference - General - Editors - File Associations 에서 파일 확장자에 연결된 Default editor 를 설정한다. pom.xml 은 Maven POM Editor 로 설정되어 있는데 XML Editor 를 선택 후 Default 버튼을 클릭하여 설정한다. xml 전체에 대한 설정을..