210422 TIL (D+71 스프링 File 업로드, 다운로드 구현)

이전 이클립스에서 Model1 방식으로 만들었던 파일 업로드 구현을 스프링에서 다시 해보았다.

이전보다 간편해진 점은 컨트롤러에서 MultipartFile 인터페이스를 통해 매개변수로 file form을 쉽게 따로 받을 수 있다는 것.

기본 세팅

1. 메이븐 레파지토리에서 fileupload 검색

2. Apache Commons FileUpload의 maven 태그 가져와서 pom.xml에 작성 (아래 태그)

<!-- https://mvnrepository.com/artifact/commons-fileupload/commons-fileupload -->
	<dependency>
	    <groupId>commons-fileupload</groupId>
	    <artifactId>commons-fileupload</artifactId>
	    <version>1.3.3</version>
	</dependency>

3. /spring 폴더에 file-context.xml 작성

file-context.xml

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans-2.0.xsd">

	<!-- upload -->
	<bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
		<property name="maxUploadSize" value="104857600"/> <!-- 한 요청당 허용되는 최대사이즈 100mb -->
		<property name="maxInMemorySize" value="102400"/>
		<property name="defaultEncoding" value="UTF-8" />
		<property name="uploadTempDir" value="upload" />
	</bean>
	
	
	<!-- download -->
	<bean id="downloadView" class="util.DownloadView"/>
	
	<bean id="downloadViewResolver" class="org.springframework.web.servlet.view.BeanNameViewResolver">
		<property name="order">
			<value>0</value>
		</property>
	</bean>

</beans>

5. web.xml에 xml 경로 추가

  <servlet>
    <servlet-name>dispatcher</servlet-name>
    <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
    <init-param>
      <param-name>contextConfigLocation</param-name>
      <param-value>
	      /WEB-INF/spring/servlet-context.xml
	      /WEB-INF/spring/aop-context.xml
	      /WEB-INF/spring/file-context.xml	<!--여기 추가됨 -->
      </param-value>
    </init-param>
    <load-on-startup>1</load-on-startup>
  </servlet>

6. 테이블 생성

DROP TABLE PDS
CASCADE CONSTRAINTS;

DROP SEQUENCE SEQ_PDS;

-----------------------

CREATE TABLE PDS(
   SEQ NUMBER(8) PRIMARY KEY,
   ID VARCHAR2(50) NOT NULL,
   TITLE VARCHAR2(200) NOT NULL,
   CONTENT VARCHAR2(4000) NOT NULL,
   FILENAME VARCHAR2(50) NOT NULL,
   NEWFILENAME VARCHAR2(50) NOT NULL,
   READCOUNT NUMBER(8) NOT NULL,
   DOWNCOUNT NUMBER(8) NOT NULL,
   REGDATE DATE NOT NULL
);

CREATE SEQUENCE SEQ_PDS
START WITH 1
INCREMENT BY 1;

ALTER TABLE PDS
ADD CONSTRAINT FK_PDS_ID FOREIGN KEY(ID)
REFERENCES MEMBER(ID);

PdsController.java

package bit.com.a.controller;

import java.io.File;
import java.io.IOException;
import java.util.List;

import javax.servlet.http.HttpServletRequest;

import org.apache.commons.io.FileUtils;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.multipart.MultipartFile;

import bit.com.a.dto.BbsDto;
import bit.com.a.dto.PdsDto;
import bit.com.a.service.PdsService;
import util.PdsUtil;


@Controller
public class PdsController {

	@Autowired
	PdsService service;
	
	@RequestMapping(value = "pdslist.do", method = {RequestMethod.GET, RequestMethod.POST})
	public String pdslist(Model model) {
		model.addAttribute("doc_title", "자료실 목록");
		
		List<PdsDto> list = service.getPdsList();
		model.addAttribute("pdslist", list);
		
		
		return "pdslist.tiles";
	}
	
	
	@RequestMapping(value = "pdsWrite.do", method = {RequestMethod.GET, RequestMethod.POST})
	public String pdsWrite(Model model) {
		model.addAttribute("doc_title", "자료 올리기");
		
		return "pdsWrite.tiles";
	}
	
	
	//업로드
	@RequestMapping(value = "pdsUpload.do", method = {RequestMethod.GET, RequestMethod.POST})
	public String pdsUpload(PdsDto pdsdto, @RequestParam(value="fileload", required = false) MultipartFile fileload,
								HttpServletRequest req) {
		
		PdsUtil.fileUpload(pdsdto, fileload, req);
		
		//DB저장
		service.uploadPds(pdsdto);
		
		return "redirect:/pdslist.do";
	}
	
	@RequestMapping(value = "fileDownload.do", method = {RequestMethod.GET, RequestMethod.POST})
	public String fileDownload(String newFilename, int seq, HttpServletRequest req, Model model) {
		
		
		/* download 경로 설정 */
		// 1. server
		String fupload = req.getServletContext().getRealPath("/upload");
		
		// 2. folder
//		String fupload = "d:\\tmp";
		
		File downloadFile = new File(fupload + "/" + newFilename);
		
		model.addAttribute("downloadFile", downloadFile);
		model.addAttribute("seq", seq);
		
		return "downloadView";
	}
	
	
	@RequestMapping(value = "pdsDetail.do", method = { RequestMethod.GET, RequestMethod.POST })
	public String pdsDetail(Model model, Integer seq, HttpServletRequest req) {
		
		if(seq == null) seq = -1;
		
		service.readCount(seq);
		PdsDto dto = service.getDetail(seq);
		
		model.addAttribute("pds", dto);
		model.addAttribute("doc_title", "글 상세페이지");
		return "pdsDetail.tiles";
	}
	
	
	
	@RequestMapping(value = "pdsDelete.do", method = { RequestMethod.GET, RequestMethod.POST })
	public String pdsDelete(Model model, Integer seq) {
		
		if(seq == null) seq = -1;
		
		boolean b = service.deletePds(seq);
		
		if(b) {
			System.out.println("삭제 성공");
		} else {
			System.out.println("삭제 실패");
		}
		
		return "redirect:/pdslist.do";
		
	}
	
	
	@RequestMapping(value = "pdsUpdate.do", method = { RequestMethod.GET, RequestMethod.POST })
	public String pdsUpdate(Model model, Integer seq) {
		
		if(seq == null) seq = -1;
		PdsDto dto = service.getDetail(seq);
		model.addAttribute("pds", dto);
		model.addAttribute("doc_title", "글수정");
		return "pdsUpdate.tiles";
	}
	
	
	@RequestMapping(value = "pdsUpdateAf.do", method = {RequestMethod.GET, RequestMethod.POST})
	public String pdsUpdateAf(PdsDto pdsdto, @RequestParam(value="fileload", required = false) MultipartFile fileload,
								HttpServletRequest req) {
		
		System.out.println("파일들어왔는지 안들어왔는지. 들어오면 true: "+!fileload.isEmpty());
		
		if(!fileload.isEmpty()) {
			PdsUtil.fileUpload(pdsdto, fileload, req);
		}
		
		System.out.println("수정사항 :" +pdsdto.toString());
		boolean b = service.updatePds(pdsdto);
		
		if(b) {
			System.out.println("수정 성공");
		} else {
			System.out.println("수정 실패");
		}
		
		return "redirect:/pdslist.do";
	}	
	
}

PdsUtil.java

업로드 관련 클래스.

서버 또는 디렉토리에 저장될 파일의 이름 중복 제거를 위해 현재 시간으로 파일 이름을 바꾸는 작업을 한다.

MultipartFile 인터페이스를 통해 파일 업로드 구현.

아래는 파일 이름에서 '.'의 위치를 앞에서부터 구했지만 파일자체 이름에 '.'이 포함될 수 있으므로,

lastIndexOf('.')를 통하여 구현하는게 바람직하다.

package util;

import java.io.File;
import java.io.IOException;
import java.util.Date;

import javax.servlet.http.HttpServletRequest;

import org.apache.commons.io.FileUtils;
import org.springframework.web.multipart.MultipartFile;

import bit.com.a.dto.PdsDto;

public class PdsUtil {

	/* 파일명 변경(time) */
	// ex) myfile.txt --> 2646718454.txt
	
	
	// myfile.txt -> indexOf('.') -> 6
	// '.'의 위치를 구하여 파일명, 확장자명 나눈다.
	// substring(0, 6) -> 파일명. 0부터 6 전까지
	// substring(6) -> 확장자명(.txt). 6부터 끝까지
	
	public static String getNewFileName(String f) {
		String filename = "";
		String fpost = "";
		
		if(f.indexOf('.') >= 0) {	// 도트가 있을 때(확장자명이 있을때),
			fpost = f.substring(f.indexOf('.'));	//확장자명 (.txt)
			filename = new Date().getTime() + fpost;
		}
		else {
			filename = new Date().getTime()+ ".back";	//임의의 확장자명을 붙여둠
		}
		
		return filename;
	}
	
	
	public static PdsDto fileUpload(PdsDto pdsdto, MultipartFile fileload, HttpServletRequest req) {
		
		/* filename 취득 */
		String filename = fileload.getOriginalFilename();
		pdsdto.setFilename(filename);	//원본 파일명
		
		/* upload 경로 설정 */
		// 1. server(tomcat)
		String fupload = req.getServletContext().getRealPath("/upload");
		
		// 2. folder(디렉토리)
//		String fupload = "d:\\tmp";
		
		System.out.println("경로 : "+fupload);
		
		/* 파일명 변경 */
		String newFilename = PdsUtil.getNewFileName(pdsdto.getFilename());
		pdsdto.setNewFilename(newFilename);
		
		
		File file = new File(fupload + "/" + newFilename);	// c:~~/~~/43253244214.jpg
		//import org.apache.commons.io.FileUtils;
		try {
			//실제 업로드 되는 부분
			FileUtils.writeByteArrayToFile(file, fileload.getBytes());
		} catch (IOException e) {
			e.printStackTrace();
		}
		
		return pdsdto;
	}
	
}

pdslist.jsp

메인 리스트 페이지.

※ 다운로드 버튼 구현 시 POST로 보내야 할 때

hidden input을 가지고 있는 form을 만들어 자바스크립트 함수를 통해 submit한다.

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
    
    
<table class="list_table" style="width:85%">
	<colgroup>
		<col width="50">
		<col width="100">
		<col width="300">
		<col width="50">
		<col width="50">
		<col width="50">
		<col width="100">
		<col width="50">
	</colgroup>
	<thead>
		<tr>
			<th>번호</th>
			<th>작성자</th>
			<th>제목</th>
			<th>다운로드</th>
			<th>조회수</th>
			<th>다운로드수</th>
			<th>작성일</th>
			<th>삭제</th>
		</tr>	
	</thead>
	<tbody>
		<c:forEach var="pds" items="${pdslist }" varStatus="i">
			<tr>
				<th>${i.count }</th>
				<td>${pds.id }</td>
				<td style="text-align: left;"><a href="pdsDetail.do?seq=${pds.seq}">${pds.title }</a></td>
				<td><input type="button" name="btnDown" value="다운로드" onclick="fileDown('${pds.newFilename}','${pds.seq }')"></td>
				<td>${pds.readcount }</td>
				<td>${pds.downcount }</td>
				<td><font size="1">${pds.regdate }</font></td>
				<td><img alt="" src="image/del.png" data_file_seq="${pds.seq }" class="btn_fileDelete" onclick="deletePage(${pds.seq })"></td>
			</tr>
		</c:forEach>
	</tbody>
</table>



<div id="button.wrap">
	<span class="button blue">
		<button type="button" id="_btnAdd">자료추가</button>
	</span>
</div>



<!-- 다운로드 버튼 클릭 -->
<form name="file_Down" action="fileDownload.do" method="post">
	<input type="hidden" name="newFilename">
	<input type="hidden" name="seq">
</form>


<script>

	$('#_btnAdd').click(function() {
		location.href = "pdsWrite.do";
	});
	

/* hidden form을 만들어 POST 방식으로 전달할 수 있다. (JS는 기본적으로 GET방식만 가능하기 때문)*/
function fileDown(newFilename, seq) {
	let doc = document.file_Down;
	doc.newFilename.value = newFilename;
	doc.seq.value = seq;
	doc.submit();
}	
	
	
function deletePage(seq) {
	 if (confirm("정말 삭제하시겠습니까?") == true){    //확인
		 location.href="pdsDelete.do?seq="+seq;
	 }else{   //취소
	     return false;
	 }
}	

	
</script>

pds.xml

DB 접근 Mybatis mapper

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper
  PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
  "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
  
  

<mapper namespace="Pds">

<select id="getPdsList" resultType="bit.com.a.dto.PdsDto">
	SELECT SEQ, ID, TITLE, CONTENT, FILENAME, NEWFILENAME, READCOUNT, DOWNCOUNT, REGDATE
	FROM PDS
	ORDER BY SEQ DESC	
</select>


<insert id="uploadPds" parameterType="bit.com.a.dto.PdsDto">
	INSERT INTO PDS(SEQ, ID, TITLE, CONTENT, FILENAME, NEWFILENAME, READCOUNT, DOWNCOUNT, REGDATE)
	VALUES (SEQ_PDS.NEXTVAL, #{id}, #{title}, #{content}, #{filename}, #{newFilename}, 0, 0, SYSDATE)
</insert>



<!-- 오리지날 이름 가져오기 -->
<select id="getFilename" parameterType="string" resultType="string">
	SELECT FILENAME
	FROM PDS
	WHERE NEWFILENAME=#{newFilename}
</select>


<!-- 조회수 증가 -->
<update id="readCount" parameterType="int">
	UPDATE PDS
	SET READCOUNT = READCOUNT + 1
	WHERE SEQ=#{seq}
</update>	

<!-- 다운로드수 증가 -->
<update id="downloadCount" parameterType="int">
	UPDATE PDS
	SET DOWNCOUNT = DOWNCOUNT + 1
	WHERE SEQ=#{seq}
</update>	


<!-- 디테일 -->
<select id="getDetail" parameterType="int" resultType="bit.com.a.dto.PdsDto">
	SELECT SEQ, ID, TITLE, CONTENT, FILENAME, NEWFILENAME, READCOUNT, DOWNCOUNT, REGDATE
	FROM PDS
	WHERE SEQ=#{seq}
</select>


<!-- 삭제 -->
<delete id="delete" parameterType="int">
	DELETE FROM PDS
	WHERE SEQ=#{seq}
</delete>


<!-- 글수정 -->
<update id="update" parameterType="bit.com.a.dto.PdsDto">
	UPDATE PDS 
	SET TITLE=#{title}, CONTENT=#{content}
	<if test="filename != null and filename != '' and newFilename != null and newFilename != '' ">	
		, FILENAME=#{filename}, NEWFILENAME=#{newFilename}
	</if>		
	WHERE SEQ=#{seq}
</update>



</mapper>

저작자표시 (새창열림)

'💻 개발 > 📖 TIL (Today I Learned)' 카테고리의 다른 글

210427 TIL(D+74 스프링 투표 구현, Crawling, 커스텀 어노테이션 활용한 AOP, 웹 소켓) (0)	2021.04.27
ajax 활용 캘린더 만들기 (1)	2021.04.21

'💻 개발 > 📖 TIL (Today I Learned)' 카테고리의 다른 글

티스토리툴바