1. 입력화면
1-1. <form enctype="multipart/form-data" >
기본 form에 enctype="multipart/form-data" 부분을 추가.
1-2. <input type="file">
파일업로드 기본 input 이다. 브라우저마자 약간 다를수는 있다.
이대로 쓰는게 가장 좋긴하지만
보통 파일선택 버튼을 이미지로 바꾸고,
파일명을 버튼 앞쪽으로 옮기는걸 많이하는데,
이렇게 되면 신경써야 하는 부분이 많아진다.
요새는 이부분에 대한 javascript 라이브러리들이 좀 많은것 같다.
대충 bootstrap 위주로 검색하자마자 나온거 2가지 첨부.
http://gregpike.net/demos/bootstrap-file-input/demo.html
http://markusslima.github.io/bootstrap-filestyle/
2. 업로드처리
2-1 mulipartrequest
multipart/form-data 로 인코딩된 form데이터를 받으려면
httpservletrequest가 아닌 multipartrequest로 받아준다.
MultipartRequest multi = new MultipartRequest(request, savePath, sizeLimit,"euc-kr", new DefaultFileRenamePolicy());
2-2 파일저장 방식
저장방법은 크게 두가지다.
blob처럼 db에 바로 저장을 하거나,
어딘가에 파일서버를 두고 db에는 파일 위치를 저장하는 저장하는 방식.
blob이 경우 쿼리로 바로 뽑으면되서, 구현이 조금 더 쉬울거 같긴하다.
후자의 경우는 nas나 파일서버가 별도로 필요해서 조금 더 복잡도가 올라가지만
DB비용이나 부하를 생각하면 후자가 좋을것 같기도 하다.
2-3 파일폴더 & 파일명 정책
파일폴더와 파일명에 대한 정책에 대한 고민은 필요하다.
예를들어,
기존에 저장된 파일에 같은 이름으로 심지어 다른 사람이 덮어쓰게 되면,
관리자 입장에서는 귀찮아지는 일이 발생할 수 있다.
그리고 서버에서 한 폴더내에 허용할 수 있는 파일 갯수나 용량에 대한 제한이 있기 때문에
시스템 특성에 따라 폴더도 구분해주는게 좋다.
기본적으로는 보통 날짜(연도/월/일)와 사용자id에 따라 구분해 주면 좋을 듯 싶다.
날짜의 경우 파일갯수가 적으면 연도단위로, 좀 많다싶으면 월, 일단위로 늘려나가면 된다. 굳이 그럴필요까지 없다면
파일명에 날짜와 사용자id를 표시해 주는것도 방법이다.
3. 파일 읽기
<a href ="{filepath}"> {filename} </a>
간단하게 a tag로 위에처럼 링크를 걸면 파일을 바로 볼 수 있다. 이렇게 구현하기 위해서는 웹프로젝트에서 파일서버에 직접 접근할수 있도록
해당 위치를 심볼릭 링크로 웹프로젝트 내부에 걸어두어야 한다.
댓글
댓글 쓰기