使用WebUploader实现分片断点上传文件功能（二）
写在前面：
让客户满意是我们工作的目标，不断超越客户的期望值来自于我们对这个行业的热爱。我们立志把好的技术通过有效、简单的方式提供给客户，将通过不懈努力成为客户在信息化领域值得信任、有价值的长期合作伙伴，公司提供的服务项目有：域名注册、虚拟主机、营销软件、网站建设、新疆网站维护、网站推广。
这几天，有去研究一下WebUploader上传文件，前面的博客有记录下使用WebUploader简单上传文件的例子，今天就把分片断点上传的例子也记录下吧，在博客园中，也查看了一些资料，基本上后台处理数据都是用的Servlet，或者是SpringMVC，由于最近的项目一直都是Struts2，所以这里就用Struts2中的action来对数据进行处理，达到分片上传文件的效果。
1.什么是分片上传?
顾名思义，就是把文件分成一片片，即让一个文件，分割成好几个小文件，然后再上传。这样做的好处是便于上传大文件。
2.分片上传大致思路：
1.前台页面，选择文件，点击按钮进行上传。
2.WebUploader将上传的文件，分割成指定的个数，挨个发送到服务端后台。
3.服务器接收分割后的小文件，并存储到临时文件夹下
4.服务器接收分割后的小文件完毕后，前台页面执行上传成功函数。
5.在上传成功函数中，发送请求到服务器，请求合并小文件为一个整体的文件。
6.服务器后台对文件进行合并操作，合并完成后删除存储小文件的临时文件。
了解了分片上传的大致过程，下面直接上demo吧。
前台页面：
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
String scheme = request.getScheme();
String serverName = request.getServerName();
String contextPath = request.getContextPath();
int port = request.getServerPort();
//网站的访问跟路径
String baseURL = scheme + "://" + serverName + ":" + port
+ contextPath;
request.setAttribute("baseURL", baseURL);
%>
WebUploader文件分片上传简单示例
<%--引入css样式--%>
<%--引入文件上传插件--%>
选择文件
后台action:
/**
* Description:com.ims.action
* Author: Eleven
* Date: 2017/12/26 10:50
*/
@Controller("FileAction")
public class FileAction {
/*用于接收分割请求的每个小文件的相关参数*/
//记得提供对应的get set方法
//上传文件对象(和表单type=file的name值一致)
private File upload;
//文件名
private String uploadFileName;
//上传类型
private String uploadContentType;
/**
* 以下变量都是public，参数太多，不想设为private再去写get,set方法了，
* 就偷个懒直接用了public了
*/
//文件分片序号
public String chunk;
public String guid;//合并与分割都有用到
//用于接收发送合并请求的相关参数
public String fileName; //文件名
public String chunks; //分割数量
//当进行分片上传文件的时候，每上传一个小文件就会调用这个方法，这个就跟普通的保存文件没啥区别的
public void uploadFile2() throws Exception{
String str = "D:/upload44/divide/"; //文件保存路径
//保存每个小文件的路径
String realPath = str + guid +"/" + chunk;
File tmp =new File(realPath);
FileUtils.copyFile(upload, tmp);
System.out.println("上传文件"+uploadFileName+",第几块："+chunk+",大小："+(upload.length()/1024/1024)+"M");
}
//文件合并
public void mergeFile() throws Exception{
String path = "D:/upload44/merge/" ;
//创建 合并文件夹
new File(path).mkdir();
//创建 合并后的文件
File newFile = new File(path + fileName);
if(!newFile.exists()){
newFile.createNewFile();
}
FileOutputStream outputStream = new FileOutputStream(newFile, true);//文件追加写入
byte[] byt = new byte[10 * 1024 * 1024];
int len;
FileInputStream temp = null;//分片文件
for (int i = 0; i < Integer.parseInt(chunks); i++) {
//"D:/upload44/divide/" + guid + "/" + i 为保存分割后的小文件的路径
temp = new FileInputStream(new File("D:/upload44/divide/" + guid + "/" + i));
while ((len = temp.read(byt)) != -1) {
System.out.println(len);
outputStream.write(byt, 0, len);
}
temp.close();
}
//当所有追加写入都写完 才可以关闭流
outputStream.close();
//删除分片文件
String path3 = "D:/upload44/divide/" + guid;
FileUtils.deleteDirectory(new File(path3));//删除目录下所有的内容
System.out.println("success!guid=" + guid + ";chunks=" + chunks + ";fileName=" + fileName);
}
public File getUpload() {
return upload;
}
public void setUpload(File upload) {
this.upload = upload;
}
public String getUploadFileName() {
return uploadFileName;
}
public void setUploadFileName(String uploadFileName) {
this.uploadFileName = uploadFileName;
}
public String getUploadContentType() {
return uploadContentType;
}
public void setUploadContentType(String uploadContentType) {
this.uploadContentType = uploadContentType;
}
}
struts.xml配置：
好啦，到这里，一个简单的文件分片断点上传就完成了。
对了补充说明下，后台只是接收了一些简单的参数而已，而从前台WebUploader传递过来的参数当然不止上面那几个了，所以，可以学会用F12调试模式，进行查看发送的请求，以及相关的请求参数，这里就不多说了
运行截图：
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持创新互联。
本文标题：使用WebUploader实现分片断点上传文件功能（二）
网址分享：http://6mz.cn/article/ipjhhh.html