[英]File Upload Progress Bar with Spring?
我有以下 RestController 用于将文件上传到我的服务器端。
@RequestMapping(value="/upload", method=RequestMethod.POST )
@CrossOrigin
public SimpleHttpResponse uploadFile(@RequestParam("uploadItem") MultipartFile fileUpload )
{
System.out.println(fileUpload.getOriginalFilename());
try {
byte[] fileBytes = fileUpload.getBytes();
Files.write(Paths.get("C:\\Users\\" + fileUpload.getOriginalFilename()), fileBytes);
} catch (IOException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
return new SimpleHttpResponse(true);
}
无论如何要跟踪在任何给定时刻收到的字节并将其公开给 UI 吗? 我在 Google 上看到的许多示例都将 Servlet/JSP 与 Apache Commons 结合使用。 是否有基于 Spring 的解决方案来获取将 Apache Commons File Upload 与 Spring 集成的进度或方法? 理想情况下,应该有一种方法可以识别来自不同用户(甚至来自同一用户)的多个文件上传。 感谢您的指点。
使用 jquery 表单插件完成基于 spring 的解决方案
页面
<!DOCTYPE html>
<html>
<head>
<title>File Upload</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.js"></script>
<script src="http://malsup.github.com/jquery.form.js"></script>
<script type="text/javascript">
$(function() {
var bar = $('.bar');
var percent = $('.percent');
var status = $('#status');
$('form').ajaxForm({
beforeSend: function() {
status.empty();
var percentVal = '0%';
bar.width(percentVal);
percent.html(percentVal);
},
uploadProgress: function(event, position, total, percentComplete) {
var percentVal = percentComplete + '%';
bar.width(percentVal);
percent.html(percentVal);
},
complete: function(xhr) {
status.html(xhr.responseText);
}
});
});
</script>
</head>
<body>
<div class="progress">
<div class="bar"></div >
<div class="percent">0%</div >
</div>
<div id="status"></div>
<form action="/multipartfileupload/upload" method="post" enctype="multipart/form-data">
<input type="file" name="file"><br>
<input type="submit" value="Upload File to Server">
</form>
</body>
</html>
文件上传控制器
/**
* @author asif.hossain
* @since 3/8/17.
*/
@Controller
@RequestMapping("/upload")
public class FileUploadController {
@RequestMapping(method = RequestMethod.GET)
String show() {
return "upload";
}
@RequestMapping(method = RequestMethod.POST)
public String uploadFile(@RequestParam("file") MultipartFile file) {
System.out.println(file.getName());
return "home";
}
}
Servlet配置
MVC-servlet.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"
xmlns:context="http://www.springframework.org/schema/context"
xsi:schemaLocation="http://www.springframework.org/schema/beans
http://www.springframework.org/schema/beans/spring-beans-4.3.xsd
http://www.springframework.org/schema/context
http://www.springframework.org/schema/context/spring-context-4.3.xsd">
<context:component-scan base-package="net.asifhossain.multipartfileupload"/>
<bean id="viewresolver" class="org.springframework.web.servlet.view.UrlBasedViewResolver">
<property name="viewClass" value="org.springframework.web.servlet.view.JstlView"/>
<property name="prefix" value="/WEB-INF/jsp/"/>
<property name="suffix" value=".jsp"/>
</bean>
<bean id="multipartResolver" class="org.springframework.web.multipart.support.StandardServletMultipartResolver"/>
</beans>
网页.xml
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee
http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd"
version="3.1">
<context-param>
<param-name>contextConfigLocation</param-name>
<param-value>/WEB-INF/applicationContext.xml</param-value>
</context-param>
<servlet>
<servlet-name>mvc</servlet-name>
<servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
<load-on-startup>1</load-on-startup>
<multipart-config>
<max-file-size>20848820</max-file-size>
<max-request-size>418018841</max-request-size>
<file-size-threshold>1048576</file-size-threshold>
</multipart-config>
</servlet>
<servlet-mapping>
<servlet-name>mvc</servlet-name>
<url-pattern>/</url-pattern>
</servlet-mapping>
</web-app>
您可以在我的 github 存储库中找到工作代码。 如果您有任何问题,请 Ping 我。
https://github.com/mirmdasif/springmvc/tree/master/springmvcmultipartfileupload
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.