파일
-
유저가 업로드 한 이미지 파일 로컬에서 가져와 사용하는 방법!Knowledge/Spring 2019. 9. 20. 09:33
보통 혼자 개발할 때나 공부할 때 이미지는 이렇게 사용할 것이다. 이렇게 소스 안에 img 폴더를 세팅해놓고 이미지들이 저장되어 있는 위치를 설정 파일에 명시해 준 다음 img 태그의 src 속성에 파일 이름을 적어주는 식으로! 그러나 실무에선 이렇게 사용하지 않는다고 한다. 보안 문제도 있고, 프로젝트 볼륨이 커지기 때문 ( 예를 들어 업로드가 많이 되는 사이트인데 파일을 전부 이렇게 프로젝트 내 폴더에 저장하게 세팅하면 용량이 상상을 초월할 것이다 ) 그럼 어떤 방법을 사용할까? 사실 가장 쉬운 선택지는 설정 파일에서 img 폴더 경로를 파일 저장 폴더로 잡아주는 것이다. 그러나 이 방법 역시 보안 이슈가 있어서 지양하고 실무에선 이 문제를 해결하기 위해 컨트롤러를 활용한다고 한다. 이를 이해하기 위..
-
스프링에서 파일다운로드 구현하는 방법Knowledge/Spring 2019. 9. 20. 08:13
일단 서버에 파일은 있고 데이터베이스에 파일 정보는 저장되어 있다고 가정한다 ( 참고 : 스프링에서 컨트롤러로 넘어온 파일 저장하는 방법 - https://takeknowledge.tistory.com/61 ) 사실 업로드를 잘 알고 있다면 다운로드도 쉽게 이해할 수 있다. outputStream과 inputStream의 역할만 바뀔 뿐 업로드와 크게 다르지 않기 때문이다. 넘어온 파일을 찾을 수 있는 파라미터로 파일 정보 찾고, 헤더에 정보 세팅하고, inputStream에서 outputStream으로 파일 정보 옮겨주면 끝! 바로 코드로 보자! 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 3..
-
스프링에서 컨트롤러로 넘어온 파일 저장하는 방법Knowledge/Spring 2019. 9. 18. 21:59
프론트 단에서 ajax로 파일을 서버로 넘기는 건 ( https://takeknowledge.tistory.com/60 ) 참고 파일이 컨트롤러 단으로 넘어오면 파일을 저장하고 나중에 사용할 수 있도록 파일 정보를 데이터베이스에 저장해야 한다. 이걸 하는 방법은 - 설정 먼저 파일 처리에 필요한 라이브러리를 메이븐에 등록해줘야 한다. 파일은 Multipart ( HTTP프로토콜의 바디 부분에 데이터를 여러 부분으로 나눠서 보낸 것 ) 로 넘어오는데 HttpServletRequest는 웹 클라이언트가 전달하는 Multipart데이터를 쉽게 처리하는 메소드를 제공하지 않기 때문이다. 대표적인 파일 처리 라이브러리는 아파치 재단의 commons-fileupload 가 있다. 추가를 위해선 1 2 3 4 5 6..
-
자바스크립트에서 이미지 파일( form data ) 을 ajax로 넘기는 방법!Knowledge/javascript 2019. 9. 18. 19:41
단순히 text value만 넘긴다고 하면 form data를 굳이 ajax로 넘겨야 할 필요는 없다. 그러나 파일을 ajax로 넘겨야할 때는 form data 전체를 넘기는 것 외엔 다른 방법이 없다. 이 때는 formData 객체를 활용하면 된다. 방법은 쉽다. 함정이 좀 있지만.. ㅋ 일단 코드를 보자! 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 Document 전송 var fileInput = document.querySelector("#fileInput"); var sendButton = document.querySelector("#sendButton"); sendButton.addEventListe..