[CH07]파일업로드

티스토리 뷰

수업/└JSP

[CH07]파일업로드

onlyun 2022. 2. 15. 11:02

※ 목차 :: (1) 파일 업로드 (2) MultipartRequest (3) Commons-FileUpload

1. 파일 업로드

웹 브라우저에서 서버로 파일을 전송해 서버에 저장(*파일 : 텍스트, 바이너리, 이미지, 문서 파일 등)

-서버 전송하기 위해 '폼 태그' 사용

-서버 저장하기 위해 '오픈 라이브러리' 필요

(1) 폼 태그 작성 규칙 - 파일 업로드를 위한 JSP페이지

<form method="post" enctype ="multipart/form-data" action="process.jsp">
	<input type="text" name="요청 파라미터 이름">
    <input type="file" name="요청 파라미터 이름2">
</form>

└메소드(method) : POST / 인코딩타입(enctype) : multipart/form-data / input type : file

(2) 파일 업로드 처리 방법

종류	MultipartRequest	Commons-FileUpload
특징	가장 간단한 방법	편리하고 강력한 API 제공
필요 라이브러리	cos.jar	commons-fileupload.jar commons-io.jar

2. 파일 업로드 : MultipartRequest

서버에 업로드 되는 파일 자체만 다루는 클래스

(1) 다운 및 환경설정

-다운로드 : http://www.servlets.com/cos/ >> 다운로드 : cos-20.08.zip >> 압출 풀기 >> lib 폴더 : cos.jar 복사

>> 이클립스 WEB-INF → lib 붙여넣기

(2) MultipartRequest 사용

-imort

<%@ page import="com.oreilly.servlet.*" %>
<%@ page import="com.oreilly.servlet.multipart.*"%>

-클래스 생성(객체 생성?)

<%
    MultipartRequest multi = new MultipartRequest(Request, "C:\\upload", 5*1024*1024,
                             "utf-8", new DefaultFileRenamePolicy());
%>

└설정 : request 내장객체, 파일 저장 경로, 파일 크기(5MB), 문자인코딩, 파일이름저장 정책

(3) MultipartRequest 메소드

-Names 메소드는 Enumeration(열거) 유형.

getFile()	getFileNames()	getParameter()	getParameterNames()
서버에 업로드된 파일 객체 반환	input type 속성값이 file인 요청 파라미터 이름 반환	요청 파라미터 이름의 값 반환	요청 파라미터 이름을 Enumeration 객체 타입 반환
getFilesystemName()	getOriginalFileName()	getContenType()
서버에 실제로 업로드된 파일명	사용자가 업로드한 실제 파일명	업로드된 파일 콘텐츠 유형 반환

#예제) MultipartRequest 메소드 사용 : 파일 업로드

-입력 폼 페이지 : 입력 양식 작성

<%@ page language="java" contentType="text/html; charset=EUC-KR"
    pageEncoding="EUC-KR"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>File UPload</title>
</head>
<body>
	<form name="fileForm" method="post" enctype="multipart/form-data"
	action="fileupload_process.jsp">
		<p>이 름 : <input type="text" name="name"></p>
		<p>제 목 : <input type="text" name="subject"></p>
		<p>파 일 : <input type="file" name="filename"></p>
		<p><input type="submit" value="파일 올리기"></p>
	</form>
</body>
</html>

-프로세스 페이지(process.jsp) : (업로드 폴더가 있어야 오류뜨지 않음)

<%@ page language="java" contentType="text/html; charset=EUC-KR" pageEncoding="EUC-KR"%>
<%@ page import="com.oreilly.servlet.*"%>
<%@ page import="com.oreilly.servlet.multipart.*"%>
<%@ page import="java.util.*"%>
<%@ page import="java.io.*"%> <!-- 입출력 -->
<%
    MultipartRequest multi = new MultipartRequest(request, "D://upload",
                             5*1024*1024, "utf-8", new DefaultFileRenamePolicy());

    Enumeration params = multi.getParameterNames(); <!--열거 객체에 값 넣음-->
	
    while(params.hasMoreElements()){
        String name = (String) params.nextElement();
        String value = multi.getParameter(name);
        out.println(name+" "+value+"<br>");
    }
    out.println("----------------------------------------------<br>");
	
    Enumeration files = multi.getFileNames();
	
    while(files.hasMoreElements()){
        String name = (String) files.nextElement();
        String filename = multi.getFilesystemName(name); <!--서버에 업로드된 파일명-->
        String original = multi.getOriginalFileName(name); <!--사용자가 업로드한 파일명-->
        String type = multi.getContentType(name); <!--파일 컨텐츠유형-->
        File file = multi.getFile(name); <!--파일 객체 반환-->
		
        out.println("요청 파라미터 이름 : "+name+"<br>");
        out.println("저장 파일 이름 : "+filename+"<br>");
        out.println("실제 파일 이름 : "+original+"<br>");
        out.println("콘 텐 츠 유 형 : "+type+"<br>");
		
        if(file != null){
            out.println("파일 크기 : "+file.length());
            out.println("<br>");
        }
    }
%>

-출력 결과

#예제) MultipartRequest 메소드 사용 : 파일 여러 개 업로드

-입력 폼 페이지 :

<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>File UPload</title>
</head>
<body>
	<form name="fileForm" method="post" enctype="multipart/form-data"
	action="fileupload02_process.jsp">
		<p>이 름1 : <input type="text" name="name1"></p>
		<p>제 목1 : <input type="text" name="subject1"></p>
		<p>파 일1 : <input type="file" name="filename1"></p>
		
		<p>이 름2 : <input type="text" name="name2"></p>
		<p>제 목2 : <input type="text" name="subject2"></p>
		<p>파 일2 : <input type="file" name="filename2"></p>
		
		<p>이 름3 : <input type="text" name="name3"></p>
		<p>제 목3 : <input type="text" name="subject3"></p>
		<p>파 일3 : <input type="file" name="filename3"></p>
		
		<p><input type="submit" value="파일 올리기"></p>
	</form>
</body>
</html>

-프로세스(process) :

<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%@ page import="com.oreilly.servlet.*"%>
<%@ page import="com.oreilly.servlet.multipart.*"%>
<%@ page import="java.util.*"%>
<%@ page import="java.io.*"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Insert title here</title>
</head>
<body>
    <%
        MultipartRequest multi = new MultipartRequest(request, "D://upload",
                                 5*1024*1024, "utf-8", new DefaultFileRenamePolicy());
	
        String name1 = multi.getParameter("name1");
        String subject1 = multi.getParameter("subject1");
		
        String name2 = multi.getParameter("name2");
        String subject2 = multi.getParameter("subject2");
		
        String name3 = multi.getParameter("name3");
        String subject3 = multi.getParameter("subject3");
		
        Enumeration files = multi.getFileNames();
		
        String file3 = (String)files.nextElement();
        String filename3 = multi.getFilesystemName(file3);
		
        String file2 = (String)files.nextElement();
        String filename2 = multi.getFilesystemName(file3);
		
        String file1 = (String)files.nextElement();
        String filename1 = multi.getFilesystemName(file3);
    %>
    <!-- 내용을 테이블로 출력 -->
    <table>
        <tr>
            <th width="100">이름</th>
            <th width="100">제목</th>
            <th width="100">파일</th>
        </tr>
        <%
            out.println("<tr><td>"+name1+"</td>");
            out.println("<td>"+subject1+"</td>");
            out.println("<td>"+filename1+"</td></tr>\n");
			
            out.println("<tr><td>"+name2+"</td>");
            out.println("<td>"+subject2+"</td>");
            out.println("<td>"+filename2+"</td></tr>\n");
			
            out.println("<tr><td>"+name3+"</td>");
            out.println("<td>"+subject3+"</td>");
            out.println("<td>"+filename3+"</td></tr>\n");
        %>
    </table>
</body>
</html>

-결과 출력

3. 파일업로드 : Commons-FileUpload

파일 업로드 패키지. 서버의 메모리상에서 파일 처리 가능.

오픈 라이브러리 다운 받아 임포트 후 사용. 아파치 API 이용.

(1) 다운 및 환경 설정

-다운로드 : http://commons.apache.org/downloads

>>FileUpload : commons-fileupload-1.4-bin.zip & IO : commons-io-2.11.0-bin.zip

>> 압축 해제 후 복사해 이클립스 WEB-INF의 lib에 붙여넣기

(복사할 파일 : commons-fileupload-1.4.jar, commons-io-2.11.0.jar)

(2) Commons-FileUpload 사용

-DiskFileUpload 객체 생성

-DiskFileUpload의 메소드를 이용해 웹 브라우저가 전송한 multipart/form-data 유형의 요청 파라미터 가져옴

-FileItem 클래스 메소드 이용해 파일 또는 일반 데이터인지 구분해 업로드 처리

(2-1) DiskFileUpload 클래스 메소드

setRepositoryPath()	parseRequest()
업로드된 파일을 임시 저장할 디렉토리 설정	multipart/form-data 유형의 요청 파라미터 가져오기
setSizeMax()	setSizeThreshold()
파일 최대 크기 설정	메모리상에 저장할 최대 크기 설정

(2-2) FileItem 클래스 메소드

isFormField()	getFielName()	getString()	getString("utf-8")
일반 데이터일 경우 true 반환	요청 파라미터 이름 가져오기	기본 문자 인코딩 사용 요청 파라미터 값 가져오기	utf-8 형싱으로 요청 파라미터 값 가져오기
isInMemory()	get()	getName()	getSize()
업로드 파일이 메모리에 저장 true	업로드된 파일을 배열로	업로드된 파일 경로 포함한 이름 가져오기	업로드된 파일 크기
getContentType()	write()	delete()
콘텐츠 유형 반환	파일과 관련된 자원 저장	파일과 관련된 자원 삭제

#예제) Commons-FileUpload 패키지로 파일 업로드, 출력

-입력 폼 페이지

<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Insert title here</title>
</head>
<body>
	<form action="fileupload03_process.jsp" method="post" enctype="multipart/form-data">
		<p> 파일 : <input type="file" name="filename"></p>
		<p> <input type="submit" value="파일 올리기"></p> 
	</form>
</body>
</html>

-프로세스 : 객체 생성, DiskFileUpload 메소드 사용해 요청 파라미터 가져옴, 유형 구분해 처리

<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%@ page import="org.apache.commons.fileupload.*" %>
<%@ page import="java.util.*, java.io.*" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>File Upload</title>
</head>
<body>
    <%
        String fileUploadPath = "D:\\upload";
		
        DiskFileUpload upload = new DiskFileUpload(); <!--객체 생성-->
		
        List items = upload.parseRequest(request); <!--메소드 이용, 요청 파라미터-->
		
        Iterator params = items.iterator(); <!--요청파라미터 Iterator 클래스 변환-->
		
        while(params.hasNext()){
            FileItem fileItem = (FileItem)params.next(); <!--데이터 구분-->
            if(!fileItem.isFormField()){
                String fileName = fileItem.getName();
                fileName = fileName.substring(fileName.lastIndexOf("\\")+1);
                File file = new File(fileUploadPath + "/" + fileName);
                fileItem.write(file);
            }
        }
    %>
</body>
</html>

(*Iterator : 보관하고 있는 자료들을 순차적으로 접근하여 처리)

#예제) 파일 업로드 및 정보 출력 : MulitpartRequest 사용

-입력 폼 페이지

<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>File UPload</title>
</head>
<body>
	<form name="fileForm" method="post" enctype="multipart/form-data"
	action="fileupload04_process.jsp">
		<p>이 름 : <input type="text" name="name"></p>
		<p>제 목 : <input type="text" name="subject"></p>
		<p>파 일 : <input type="file" name="filename"></p>
		<p><input type="submit" value="파일 올리기"></p>
	</form>
</body>
</html>

-프로세스

<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%@ page import="org.apache.commons.fileupload.*" %>
<%@ page import="java.util.*, java.io.*" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Insert title here</title>
</head>
<body>
    <%
        String path = "D:\\upload";
	
        DiskFileUpload upload = new DiskFileUpload(); <!--파일업로드를 위한 DiskFileUpload 클래스 생성-->
		
        upload.setSizeMax(1000000); <!--파일 최대 크기-->
        upload.setSizeThreshold(4096); <!--메모리 상에 저장할 최대 크기-->
        upload.setRepositoryPath(path); <!--업로드 된 파일 임시 저장할 경로-->
		
        List items = upload.parseRequest(request); <!--전송된 요청 파라미터 받기-->
        Iterator params = items.iterator(); <!--요청 파라미터를 Iterator 클래스 변환-->
		
        while (params.hasNext()){
            FileItem item = (FileItem) params.next();
            if(item.isFormField()){ <!--전송된 데이터가 일반 데이터라면-->
                String name = item.getFieldName();
                String value = item.getString("utf-8");
                out.println(name + "=" +value+"<br>");
            }else{                  <!--파일일 경우-->
                String fileFieldName = item.getFieldName();
                String fileName = item.getName();
                String contentType = item.getContentType();
				
                fileName = fileName.substring(fileName.lastIndexOf("\\")+1);
                long fileSize = item.getSize();
				
                File file = new File(path+"/"+fileName);
                item.write(file);
				
                out.println("-------------------------<br>");
                out.println("요청 파라미터 이름 : "+fileFieldName+"<br>");
                out.println("저장 파일 이름 : "+fileName+"<br>");
                out.println("파일 콘텐츠 유형 : "+contentType+"<br>");
                out.println("파일 크기 : "+fileSize+"<br>");
            }
        }
    %>
</body>
</html>

-parseRequest(request)는 DiskFileUpload 클래스의 메소드이고 매개변수로 request를 가져온다는 뜻.

-파일 이름 및 확장자 가져오기

fileName = fileName.substring(fileName.lastIndexOf("\\")+1);

└인덱스 끝에서부터 찾아온다. 그리고 그 인덱스 번호에 +1한 위치부터 substring한다. 문자열 반환.

(*이클립스에서 실행할 때, 주석 빼야함. 아니면 주석 때문에 오류남.)

-출력결과

name=a
subject=wolf
-------------------------
요청 파라미터 이름 : filename
저장 파일 이름 : KakaoTalk_20220108_004246094_07.jpg
파일 콘텐츠 유형 : image/jpeg
파일 크기 : 85192

[연습문제]

저작자표시 (새창열림)

'수업 > └JSP' 카테고리의 다른 글

[CH13]세션 연습문제 (0)	2022.02.17
[CH13]세션(Session) (0)	2022.02.17
[CH06]폼 태그 (0)	2022.02.14
[CH05]내장객체 (0)	2022.02.14
[00]주석 (0)	2022.02.13

공지사항

최근에 올라온 글

최근에 달린 댓글

Total

Today

Yesterday

링크

TAG more

« 2026/03 »
일	월	화	수	목	금	토
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

글 보관함

LOG.info("yun's dev");

티스토리 뷰