0919 JSP - 답글 이미지 넣기 , 첨부 파일
Contents
이클립스 새 창 빠르게 키는 법
window - > new window
답글 이미지 넣기
boardList.jsp
bno = re_ref 일반글, 아니면 답글
re_level이 0보다 크면 답글
<td>
<% if(dto.getRe_lev() >0){%>
<img src = "level.gif" width="<%=dto.getRe_lev()*10%>">
<img src = "re.gif">
<%} %>
<a href = "boardContent.jsp?bno=<%=dto.getBno()%>&pageNum=<%=pageNum%>"
<%=dto.getSubject() %>
<img src = "level.gif" width="<%=dto.getRe_lev()*10%>">
width 값을 줌으로써, 답글의 답글은 위치가 더욱 밀리게 됨.
첨부파일 - 파일 업로드 구현
cos.jar 다운로드!
이걸 다운받아야 구현이 된다〰️☕️
Servlets.com | com.oreilly.servlet
servlets.com
다운로드
lib => cos.jar (자바 압축 파일)
이 파일을 라이브러리에 설치 하기 위해서 복사 후, 이클립스 lib 에 붙여넣기 한다.
다른 방법 (순수 자바프로젝트는 이렇게 넣어야함. 웹프로젝트에서는 그냥 복붙만 해도 충분하다.)
프로젝트 우클릭 -> 설정 -> build path 에 가서 build path에 cos.jar 를 추가해주면, referenced libraries에 cos.jar 가 생긴다.
fileUploadForm.jsp
<h1>fileUploadForm.jsp</h1>
<form action="fileUploadPro.jsp" method = "post" enctype = "multipart/form-data">
이름 : <input type = "text" name = "name"> <br>
메세지 : <input type = "text" name = "msg"> <br>
첨부파일 : <input type = "file" name = "file"> <br>
<input type = "submit" value = "파일업로드">
</form>전달 방식
무조건 post 여야 한다!
get 방식 = 주소줄에 가져간다. 빠르지만, 크기에 제약이 있음.
post 방식 = 주소줄이 아닌 body에 담아 가기 때문에, 크기 제약이 없다.
첨부파일에 크기 제약이 없이 데이터를 보내기 위해서는 post 방식을 써야한다는 것이다.
즉, 첨부파일로 보내고 싶으면 post 방식이어야 함
MIME 타입
MIME 타입이란 클라이언트에게 전송된 문서의 다양성을 알려주기 위한 메커니즘이다.
웹에서 파일의 확장자는 별 의미가 없습니다. => 내가 한글 파일을 주든, pdf 파일을 주든, 웹에서는 똑같은 파일 덩어리다.
내가 보낼 때는 한덩어리로 보내지만, 받을 때가 문제임.
받을 때는, 어떤 파일인지는 대충 알아야 함(이미지로 받을 때, 뷰어가 필요하니까 미리 준비하는 것처럼)
그래서, 보낼 때 미리 힌트를 주기 위해서 박스에 적어주는 것.
img면 img 라고 적어주는 것 => MIME 타입
멀티파트 타입
멀티파트 타입은 일반적으로 다른 MIME 타입들을 지닌 개별적인 파트들로 나누어지는 문서의 카테고리를 가리킵니다. 즉 이 타입은 합성된 문서를 나타내는 방법입니다.
웹 개발자들을 위한 중요한 MIME 타입
application/octet-stream
이 타입은 이진 파일을 위한 기본값입니다. 이 타입은 실제로 잘 알려지지 않은 이진 파일을 의미하므로, 브라우저는 보통 자동으로 실행하지 않거나 실행해야 할지 묻기도 합니다. Content-Disposition 헤더가 값 attachment 와 함게 설정되었고 'Save As' 파일을 제안하는지 여부에 따라 브라우저가 그것을 다루게 됩니다.
text/plain
이것은 텍스트 파일에 대한 기본값입니다. 실제로 알려지지 않은 텍스트 파일일지라도 브라우저들은 그것을 디스플레이할 수 있다고 가정합니다.
text/plain이 모든 종류의 텍스트 데이터를 의미하지는 않는다는 것을 알아두시기 바랍니다. 만약 브라우저가 특정 종류의 텍스트 데이터를 예상한 경우, 반드시 일치한다고 간주하지 않을 겁니다. 특히, CSS 파일을 선언한 <link> 엘리먼트로부터 text/plain 파일을 다운로드할 경우, text/plain으로 표현된다면 브라우저는 그것을 유효한 CSS 파일로 감지하지 않을 겁니다. CSS의 MIME 타입인 text/css이 사용되어야 합니다.
text/css
웹 페이지 내에서 보통 인터프리트되어야 하는 모든 CSS 파일들은 text/css 파일이 되어야 합니다. 대게 서버들은 .css 접미사를 가진 파일들을 CSS 파일이라고 인식하지 못해 text/plain 혹은 application/octet-stream MIME 타입으로 전송합니다: 이런 경우 대부분의 브라우저들이 CSS 파일이라고 인식하지 못하며 조용히 무시될 겁니다. 올바른 타입으로 CSS 파일을 서브하는데 특별한 주의가 필요합니다.
text/html
모든 HTML 컨텐츠는 이 타입과 함께 서브되어야 합니다. application/xml+html와 같은 XHTML을 위한 대체 MIME 타입들은 현재에는 대부분 쓸모가 없습니다(HTML5이 이 포맷을 흡수했습니다).
실행
파일을 선택할 수 있다.
파일을 선택해도, 업로드가 된 게 아니고
연결만 했을 뿐이다.
🙀
fileUploadPro.jsp
파일 업로드 처리
wepapp에 폴더 하나 추가
파일 업로드 장소 -> upload 폴더 (가상경로 이클립스의 upload 폴더)
실제 파일이 저장 되는 곳은 (서버 안에 upload 라는 폴더에 저장이 된다)
<%
String path = request.getRealPath("/upload");
System.out.println("path : " + path);
%>실제 올라가는 파일을 이 경로를 이용해 확인 함
[console]
path : D:\workspace_jsp\.metadata\.plugins\org.eclipse.wst.server.core\tmp0\wtpwebapps\JSP\upload
이 경로는 어디일까?
저 경로에 파일을 하나 넣으면, 이클립스에서도 뜬다.
업로드 파일의 크기 제한 : 10MB
int maxSize = 10 * 1024 * 1024;
1000이 아니라 왜 1024Byte 일까?
2진수로 표현할 수 있는 1000에 가장 가까운 숫자가 1024이기 때문이다.
파일 업로드 (cos.jar가 있기 때문에 쓸 수 있는 객체)
MultipartRequest multi = new MultipartRequest();
기본 생성자가 정의되어 있지 않다고 에러뜸.(원래 자동으로 만들어짐)
=> 자동으로 안만들어졌다. => 즉, 오버로딩된 생성자가 있다.
같은 이름을 갖고 있지만, 서로 다른 매개변수 형식을 가지고 있는 메서드를 여러 개 정의하는 것.
loading은 물건을 싣는 것이다.
over loading이면 과적해서 싣는 것이다.
보통 하나의 메서드로 하나의 기능만 구현해지만
하나의 메서드로 여러 기능을 구현하기 때문에 붙여진 이름이다.
Multipart Requst
MultipartRequest를 이용할 경우, 파일 업로드를 수행하는 것은 사실상 단 한 줄 밖엔 되지 않기 때문에 굉장히 쉽게 파일 업로드를 구현할 수 있다.
http://www.servlets.com/cos/javadoc/com/oreilly/servlet/MultipartRequest.html
MultipartRequest
A utility class to handle multipart/form-data requests, the kind of requests that support file uploads. This class emulates the interface of HttpServletRequest, making it familiar to use. It uses a "push" model where any incoming files are read and saved d
www.servlets.com
MultipartRequest multi
= new MultipartRequest(
request,
path,
maxSize,
"UTF-8",
new DefaultFileRenamePolicy()
);
System.out.println ("파일 업로드 성공! ");이 객체를 이용하려면 cos.jar를 써야 한다.
웹 페이지에서 서버로 업로드되는 파일 자체만 다루는 클래스.
웹 브라우저가 전송한 multipart/form-data 유형과 POST 방식의 요청 파라미터 등을 분석한 후 일반 데이터와 파일 데이터를 구분하여 파일 데이터에 접근,
한글 인코딩 값을 얻기 쉽고, 서버의 파일 저장 폴더에 동일한 파일명이 있으면 파일명을 자동으로 변경
오픈 라이브러리 cos.jar를 배포 사이트에서 직접 다운로드해서 사용
JSP 페이지에 page 디렉티브 태그의 import 속성을 사용하여 패키지 com.oreilly.servlet.*을 설정
파일을 업로드 하면
D:\workspace_jsp\.metadata\.plugins\org.eclipse.wst.server.core\tmp0\wtpwebapps\JSP\upload
해당 파일은 여기에 있음.
보낸 값 받기
* 객체 생성 == 파일 업로드
MultipartRequst multi
= new MultipartRequest (
request, (폼태그의 정보)
path, (파일이 업로드 될 경로(서버의 경로)),
maxSize, (파일 업로드 크기),
"UTF-8", (파일 명 인코딩),
new DefaultFileRenamePolicy() (파일이름 중복 처리 객체 - (1),(2)...)
);
근데 이클립스에는 값이 null로 뜬다!
원래 parameter로 보내면 request 로 받아야함.
하지만 form 태그를 enctype = "multipart/form-data" (파일의 데이터 값 전체가 넘어가기 때문에 다르게 접근해야 함)
로 보냈고, 위의 multi 라는 객체에 request 를 담았으니
multi.getParameter로 호출해야 name이랑 msg 정보를 불러올 수 있는 것이다.
String name = multi.getParameter("name");
String msg = multi.getParameter("msg");
파일 이름도 출력하려면 어떻게 할까?
String file = multi.getFilesystemName("file");[console]
이름 : 안녕하세요, 메시지 : 안녕하세요, 파일이름 :bare1.jpg
파일이름 출력 성공
중복되는 파일 명 처리
=> 서버에 저장되는 파일명(중복파일 -> 이름 변경 됨)
String file = multi.getFilesystemName("file");
=> 원래 파일명
String o_file = multi.getFilesystemName("file");System.out.println("파일명 : " +file);
System.out.println("파일명_o : "+o_file);
이름이 같은 A.jpg 2파일이 이름은 같지만, 안의 데이터는 다를 수 있기 때문에 항상 구분해서 볼 수 있어야 한다.
다운로드 페이지 이동 링크 만들기
<a href ="fileDown1.jsp?file_name=<%=o_file%>">다운로드 페이지 이동1 </a>
<hr>
<a href ="../upload/<%=o_file%>">다운로드 페이지 이동2 </a>
다운로드 할 정보의 대상이 필요하다.
original file 로 이동할 수 있는 a 링크를 걸었다.
text 파일을 올리면 text 파일이 열리고 jpg 파일을 올리면 jpg 파일이 열린다
하지만 zip 파일을 올리면 zip 파일이 다운로드 됨