Echarts之柱狀圖動態加載數據篇
阿里EasyExcel導入導出Excel表格篇
點擊獲取源碼
老規矩,先上效果:
依賴:
<dependency>
<groupId>commons-fileupload</groupId>
<artifactId>commons-fileupload</artifactId>
<version>1.3.1</version>
</dependency>
<dependency>
<groupId>commons-io</groupId>
<artifactId>commons-io</artifactId>
<version>2.4</version>
</dependency>
SpringMVC.xml:
<bean id="multipartResolver"
class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
<!--文件大小-->
<property name="maxUploadSize" value="10240000"/>
<!--默認編碼-->
<property name="defaultEncoding" value="UTF-8"/>
</bean>
web.xml:
<!--過濾器Spring編碼-->
<filter>
<filter-name>characterEncodingFilter</filter-name>
<filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class>
<init-param>
<param-name>encoding</param-name>
<param-value>UTF-8</param-value>
</init-param>
<init-param>
<param-name>forceEncoding</param-name>
<param-value>true</param-value>
</init-param>
</filter>
<filter-mapping>
<filter-name>characterEncodingFilter</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>
前臺代碼:(細品前端代碼)
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.4.1/jquery.js"></script>
<script type="text/javascript">
function filename() {
var file = $("#file").val();
var parame = encodeURI(file);
alert(parame)
$.ajax({
type: 'POST',
dataType: 'text',
url: '${pageContext.request.contextPath}/file/filename?filename=' + parame,
});
}
function downname(e) {
var id = $(e).attr("id");
var parame = encodeURI(id);
alert(id);
window.location.href = "${pageContext.request.contextPath}/file/down?downname=" + parame;
}
</script>
</head>
<body>
<h2>文件上傳下載測試頁面</h2>
<%--上傳--%>
<form action="/file/upload" method="post" enctype="multipart/form-data">
選擇文件:<input id="file" type="file" name="file" width="120px">
<input type="submit" value="上傳" onclick="filename()">
</form>
<%--下載--%>
<form action="/file/down" method="GET" id="downnameform">
<c:forEach items="${file}" var="filename">
<a>${filename}</a>
<input id="${filename}" class="namelist" type="button" value="下載" onclick="downname(this)">
<p><%--換行用--%></p>
</c:forEach>
</form>
<hr>
</body>
</html>
Controller:(細品後端代碼)
/**
* 跳轉文件上傳下載頁面
*/
//獲取當此上傳文件名
String fileName = null;
//存儲每一次上傳的文件名
List<Object> allfilename = new ArrayList<>();
@RequestMapping("/file/FilePage")
public String FilePage(HttpServletRequest request){
HttpSession session = request.getSession();
session.setAttribute("file",allfilename);
return "FilePage";
}
/**
* 文件上傳功能
* @param file
* @return
* @throws IOException
*/
@RequestMapping(value="/file/upload",method=RequestMethod.POST)
@ResponseBody
public String upload(MultipartFile file) throws IOException {
//得到上傳文件名
fileName = file.getOriginalFilename();
//存儲每一次上傳的文件名
allfilename.add(fileName);
//文件上傳地址
String path = "F:\\file";
//創建文件流
File dir = new File(path,fileName);
//如果父目錄不存在,連同父目錄一起創建。
if(!dir.exists()){
dir.mkdirs();
}
//MultipartFile自帶的解析方法
file.transferTo(dir);
return "ok!";
}
/**
* 文件下載功能
* @param response
* @throws IOException
*/
@RequestMapping(method =RequestMethod.GET ,value = "/file/down")
public void down(HttpServletResponse response,String downname) throws IOException {
//文件路徑
String path = "F:\\file\\"+downname;
//獲取輸入流
InputStream bis = new BufferedInputStream(new FileInputStream(new File(path)));
//轉碼,免得文件名中文亂碼
path = URLEncoder.encode(path,"UTF-8");
//設置文件下載頭
response.addHeader("Content-Disposition", "attachment;filename=" + URLEncoder.encode(downname,"UTF-8"));
//設置文件ContentType類型,這樣設置,會自動判斷下載文件類型
response.setContentType("multipart/form-data");
// 創建輸出流
BufferedOutputStream out = new BufferedOutputStream(response.getOutputStream());
int len = 0;
//循環將輸入流中的內容讀取到緩衝區當中
while((len = bis.read()) != -1){
out.write(len);
out.flush();
}
// 關閉輸出流
out.close();
}