고정 헤더 영역
상세 컨텐츠
본문
반응형
페이지 개발할때 여러 파일을 한번에 다운 받고 싶은 경우가 있습니다.
일일이 다운받기에는 종류가 많거나 귀찮고... 압축으로 받자니 다시 풀어야 하고...
압축 안하고 여러 파일을 다운로드 받는 소스를 작성해 보았습니다.
위 사진과 같이 다운로드 경로에 무압축으로 여러장이 다운로드 됩니다.
핵심은 안보이는 iframe 를 생성해서 파일 수 만큼 호출하는것 입니다.
해설은 주석을 참고하세요.^^
home.jsp
<!DOCTYPE html>
<html>
<head>
<title>Home</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.3.js"></script>
<script type="text/javascript">
$(document).ready(function(){
var iFrameCnt = 0;
$('.all_download').click(function(event){ //다운로드 이미지 실행
$('img[name*="ImageList"]').each(function(i){ //img 태그중 ImageList 명으로 시작하는 요소를 가져옴
urlPath = $(this).attr("src"); //전체 URL 경로
fileName = $(this).attr("src").substring($(this).attr("src").lastIndexOf("/")+1); //파일명 추출
var url = "/image/download?urlPath="+urlPath+"&fileName="+fileName; //다운로드 받는 경로 와 변수
fnCreateIframe(iFrameCnt); // 보이지 않는 iframe 생성, name는 숫자로
$("iframe[name=" + iFrameCnt + "]").attr("src", url);
iFrameCnt++;
fnSleep(1000); //각 파일별 시간 텀을 준다
});
});
fnSleep = function (delay){
var start = new Date().getTime();
while (start + delay > new Date().getTime());
};
fnCreateIframe = function (name){
var frm = $('<iframe name="' + name + '" style="display: none;"></iframe>');
frm.appendTo("body");
}
});
</script>
</head>
<body>
<div>
<table border="1">
<tr>
<td>
<img name="ImageList_1" width="100" src="https://www.google.co.uk/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png" >
</td>
<td>
<img name="ImageList_2" width="100" src="https://t1.daumcdn.net/daumtop_chanel/op/20170315064553027.png" >
</td>
<td>
<img name="ImageList_3" width="100" src="https://www.gstatic.com/webp/gallery/4.sm.jpg" >
</td>
</tr>
</table>
</div>
<button type="button" id="all_download" class="all_download" download>All Download</button>
</body>
</html>
HomeController.java
package com.spring.myapp;
import java.io.BufferedOutputStream;
import java.io.IOException;
import java.io.InputStream;
import java.net.MalformedURLException;
import java.net.URL;
import java.util.Locale;
import java.util.Map;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
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;
/**
* Handles requests for the application home page.
*/
@Controller
public class HomeController {
private static final Logger logger = LoggerFactory.getLogger(HomeController.class);
@RequestMapping(value = "/", method = RequestMethod.GET)
public String home(Locale locale, Model model) {
return "home";
}
@RequestMapping("/image/download")
public void imageDownload(@RequestParam Map<String,Object> param, HttpServletResponse response, HttpServletRequest request){
String urlPath = (String) param.get("urlPath"); //full경로
String fileName = (String) param.get("fileName"); //파일명
try {
URL url = new URL(urlPath);
response.setHeader("Content-disposition", "attachment;filename=" + fileName);
response.setContentType("application/octer-stream");
InputStream is = url.openStream();
BufferedOutputStream outs = new BufferedOutputStream(response.getOutputStream());
int len;
byte[] buf = new byte[1024];
while ( (len = is.read(buf)) > 0 ) {
outs.write(buf, 0, len);
}
outs.close();
} catch (Exception e) {
e.printStackTrace();
}
}
}
반응형
'Spring' 카테고리의 다른 글
| Spring REST API 예제 (0) | 2023.03.08 |
|---|---|
| MyBatis query log (변수 매핑된 쿼리 로그 출력) (2) | 2020.02.20 |
| Spring boot 구조 (스프링 부트) (0) | 2018.09.12 |
| [Spring] STS Maven 2.5.1 Install 컴파일 에러 (tools.jar) 출처: http://pnot.tistory.com/6 [프로그래밍 노트] (0) | 2018.03.07 |
| [Spring] @Scheduled 정해진 시간에 맞춰서 모듈 실행하기 (0) | 2017.11.27 |
댓글 영역