1. 简介:
本篇文章基于实际项目的开发,将介绍项目中关于大文件分片上传、文件验证、断点续传、手动重试上传等需求的使用场景及实现;
2. 项目需求
- 在一个音视频的添加中,既要有音视频的简介(如音视频内容文字介绍、自定义主题名称等一些基本的信息),又要有音视频所需要的多个文件(就像电视剧,一部电视剧有多集一样)。在数据库中具体表现为一对多的关系,即一个视频对应多个文件。
下文就以电视剧为例
- 如果一个电视剧中,既有上百兆的,也有几十兆的视频,但是如果在不稳定的一个网络环境中,c传输大文件时,客户想先把小的视频上传了,之后再来继续传未传完的大文件声誉部分,这就需要断点续传的功能;
- 电视剧中至少有一集(至少有一个文件),无文件的电视剧基本信息无效;
3. 需求分析
-
确定电视剧基本信息(自定义名称,内容简介、演员简介、播出时间等)及文件的上传方式
- 基本信息和音视频文件分开上传(因为在原有的数据库表设计中,文件表是关联于基本信息,所以必须要有音视频主键,才能在数据库添加对应的文件信息),取得基本信息主键之后再去上传文件;
-
文件断点续传中,如何分片;文件接收方式;服务器端如何判断是哪个文件的分片;如何拼接各个分片;上传过程中发生意外情况(如断网,关闭浏览器),如何处理?
- 分片方式: 在客户端进行分片;
- 服务器端接收方式:使用MultipartFile接收文件
- 服务器端确定是哪个文件的分片: 在客户端按照一定规则(UUID或其他方式)生成唯一名称,在服务器端直接找到与该名称相同的文件片段;
- 拼接文件分片: 使用NIO的方式,将分片追加到已有分片的后面;
- 上传中发生意外:
A. 断网: 该情况类似于暂停上传,上传到文件处于暂停状态,网络恢复,即可点击继续上传按钮,继续上传;
B. 关闭浏览器: 在关闭时,给用户提示框,询问是否继续保存,若不保存,则根据视频基本信息表的主键的删除脏数据;
C. 第一个文件在上传时候,被用户取消或者断网,则服务器端未修改基本信息为有效,并且也未标记该文件为有效记录,可以理解为脏数据,但不需要清理这些数据(在查询的时候,不能查出这些无效记录,可以在更新视频基本信息记录的时候,查找这些脏数据,并清理磁盘上及数据表中的记录);
4. 实现
根据需求,已经确认了先上传基本信息,后上传文件,基本信息的提交(标题、简介、封面)比较简单,只需要在前端提交数据表所需字段,然后后台返回插入的主键即可,所以基本信息的提交及返回不过多说明,仅仅通过前端页面截图及后端部分代码进行简要说明,实现部分主要讲解分析文件上传部分的代码;
说明:本篇文章主要涉及到两张表的操作,两张表的数据结构如下:
- 4.1.1 前端提交基本信息页面
提交页面使用模板+原生html+css实现,每个人的页面、所需参数各不相同,所以在前端代码中,没有多大的参考价值,所以直接使用截图,来表现我需要做的工作、传的参数。
- 4.1.2 前端保存基本信息代码
可以根据自己的业务使用FormData封装传递的参数
//点击保存按钮后保存数据 function save_microClass() { //获取form的基本信息 var classTitle = $("#classTitle").val(), classDes = $("#classDes").val(), coverFile = document.getElementById("coverFileName").files[0], //构造一个新表单,FormData是HTML5新增的,因为基本信息中存在封面图片,所以需要使用表单提交数据 var form = new FormData(); form.append("title", classTitle); form.append("desc", classDes); form.append("coverFile", coverFile); //Ajax提交 $.ajax({ url: "micro/save", type: "POST", data: form, async: true, //异步 processData: false, //很重要,告诉jquery不要对form进行处理 contentType: false, //很重要,指定为false才能形成正确的Content-Type success: function(data){ //在添加音视频基本信息之后,服务器端返回新增音视频的主键,以便之后上传文件时,与文件进行关联 if(data.length>0){ $("#microClassId").val(data); submitFile();//提交文件 } } }); } }复制代码
- 4.1.3 基本信息服务器端接收方法
服务器端需要与前端协同作战,接收参数需要与前端传递过来的参数对应上,以免报出400的错误。
/** * @Description: 新增基本信息时保存form表单 * @param title * 音视频名称 * @param coverFile * 封面对象 * @param desc * 音视频描述字段 */ @RequestMapping(value = "/save", method = RequestMethod.POST) @ResponseBody public Integer create(String title,String desc, MultipartFile coverFile) { try { //保存基本信息逻辑,自己实现,然后返回基本信息插入后的主键 //request,即HttpServletRequest对象,在项目启动时候就被注入,如下: /** * @Autowired * private HttpServletRequest request; **/ Integer videoId = videoService.save(title,desc, coverFile, request); return videoId; } catch (Exception e) { e.printStackTrace(); } return null; }复制代码
- 4.2.1 前端上传文件示例
- 4.2.2 前端实现
在前端实现中,采用纯JavaScript+html+css来实现按钮的删除、添加、文件的添加、上传时暂停、继续、以及文件的顺序控制;
<div class="row pb40 pt40 mlr-10 border-top-1">
<div class="col-xs-12 col-lg-12">
<div class="col-xs-12 col-lg-12">
<span id="mediaLable">添加视频内容</span><small style="color: #ff5704;margin-left:10px;" id="mediaLimit">视频格式仅支持MP4及AVI,文件大小需小于500M</small>
</div>
<div id="mediaFiles" class="col-xs-12 col-lg-12 mt20 video-list-wrap">
</div>
<div class="col-xs-10 col-xs-offset-1 col-lg-10 col-lg-offset-1 mt20 mb10">
<a href="javascript:;" id="addMediaButton" onclick="addFileInput()" class="mybtn btn-add-user2">添加视频</a>
</div>
</div>
</div>复制代码
以上代码,就是文件上传部分的html代码,无需关心css样式,但需要注意每个元素的id/name/事件函数;以下就是JavaScript实现文件上传逻辑的代码;
<script type="text/javascript">
//删除一个上传文件文本框
function delFileInput(that) {
var delFileDivId = $(that).parent().attr("id");
//如果是修改页面的删除则将要删除的附件ID保存在隐藏框
if (delFileDivId.indexOf("modify") == 0) {
var deleteFileIds = $("#deleteFileIds").val();
if (deleteFileIds.length > 0) {
deleteFileIds = deleteFileIds + "," + delFileDivId.split("_").pop();
$("#deleteFileIds").val(deleteFileIds);
} else {
$("#deleteFileIds").val(delFileDivId.split("_").pop());
}
}
var uploadFileDivs = $("#mediaFiles").children();
episodeCount = uploadFileDivs.length-1;
//删除后修改集数
for(var i=1;i<uploadFileDivs.length;i++){
if($("#mediaFiles").children()[i].id==$(that).parent().parent().attr("id")){
$(that).parent().parent().remove();
for(var j=i;j<uploadFileDivs.length;j++){
$($("#mediaFiles").children()[j]).find(".account").text("第"+(j+1)+"集");
}
break;
}
}
}
//上传附件文本框计数器
var inputCount = 0;
var episodeCount = 0;
//点击按钮后新增一个上传文件文本框
function addFileInput() {
//把新增的每一行都放到一个div中,删除时删除这个父div节点即可
var rootFileDiv = document.createElement("div");
rootFileDiv.setAttribute("id", "rootFileDiv" + inputCount);
if(inputCount==0){
rootFileDiv.setAttribute("class", "col-xs-12 col-lg-12 video-list");
}else{
rootFileDiv.setAttribute("class", "col-xs-12 col-lg-12 full video-list mt20");
}
$("#mediaFiles").append(rootFileDiv);
//删除图标
var delDiv = document.createElement("div");
delDiv.setAttribute("id", "delFileDiv" + inputCount);
delDiv.setAttribute("class", "delete");
if(inputCount>0){
var delDivText = "<span>×</span>";
delDiv.innerHTML = delDivText;
}
//集数
var countDiv = document.createElement("div");
countDiv.setAttribute("id", "account");
countDiv.setAttribute("class", "account");
var countDivText = "第"+(episodeCount+1)+"集";
countDiv.innerHTML = countDivText;
//文件名称显示文本框
var mediaFileNameDiv = document.createElement("div");
mediaFileNameDiv.setAttribute("class", "name");
var mediaFileNameDivInput = "<input type='text' id=mediaFile" + inputCount + "_Name" + " class='form-control' />";
mediaFileNameDiv.innerHTML = mediaFileNameDivInput;
//文件上传文本框
var mediaFileDiv = document.createElement("div");
mediaFileDiv.setAttribute("class", "filebtn");
var mediaType = $("#type").val();
var mediaFileInput;
if(mediaType==0){
mediaFileInput = "<a><span>选择文件 ></span><input type='file' accept='.mp4,.avi' name='myfiles' id=mediaFile"+inputCount+"_ class='' onchange='handleFile(this)'/></a>";
}else{
mediaFileInput = "<a><span>选择文件 ></span><input type='file' accept='.mp3' name='myfiles' id=mediaFile"+inputCount+"_ class='' onchange='handleFile(this)'/></a>";
}
mediaFileDiv.innerHTML = mediaFileInput;
//上传进度条
var progressbarDiv = document.createElement("div");
progressbarDiv.setAttribute("id", "progressbar"+inputCount);
progressbarDiv.setAttribute("class", "progress hide");
var progressbarDivText = '<div class="progress-bar progress-bar-green" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100" style="width: 0%;"></div><div class="percent">0%</div><div class="size">40M/200M</div>';
progressbarDiv.innerHTML = progressbarDivText;
//暂停上传或者继续上传按钮
var uploadStatusButtonDiv = document.createElement("div");
uploadStatusButtonDiv.setAttribute("id", "uploadStatusButton"+inputCount);
uploadStatusButtonDiv.setAttribute("class", "result");
uploadStatusButtonDivButton = '<span class="success hide"><i class="fa fa-check-circle"></i>上传完成</span><span class="stop-continue hide" id="uploadStatusButton" onclick="changeUploadStatus(this)">暂停上传</span>';
uploadStatusButtonDiv.innerHTML = uploadStatusButtonDivButton;
$("#rootFileDiv" + inputCount).append(delDiv);
$("#rootFileDiv" + inputCount).append(countDiv);
$("#rootFileDiv" + inputCount).append(mediaFileNameDiv);
$("#rootFileDiv" + inputCount).append(mediaFileDiv);
$("#rootFileDiv" + inputCount).append(progressbarDiv);
$("#rootFileDiv" + inputCount).append(uploadStatusButtonDiv);
inputCount++;
episodeCount++;
return rootFileDiv;
}
//mediaFileArray存放分片数据信息
var mediaFileArray=new Array();
//获取上传分片数据基本信息,获取完毕后调用上传方法提交分片
function submitFile(){
var fileInputs = $("input[name='myfiles']");
for(var i=0;i<fileInputs.length;i++){
if(fileInputs[i].files[0]!=null){
var newName = guid();
var name = fileInputs[i].files[0].name, //文件名
size = fileInputs[i].files[0].size, //总大小
type = fileInputs[i].files[0].type, //文件类型
shardSize = 10 * 1024 * 1024, // shardSize = 10 * 1024 * 1024, 以10MB为一个分片
shardCount = Math.ceil(size / shardSize); //总片数
var shardArray = new Array();
shardArray[0]=name;
shardArray[1]=size;
shardArray[2]=type;
shardArray[3]=shardSize;
shardArray[4]=shardCount;
shardArray[5]=0;//当前上传状态,0-等待上传,1-正在上传,2是上传完成
shardArray[6]=0;//已传输最后分片编号
shardArray[7]=newName;//服务器存储名称
mediaFileArray[i]=shardArray;//将每个file的分片信息放入全局数组
}else{
//当进入修改页面file为空时
var newName = guid();
var name = "", //文件名
size = 0, //总大小
type = "", //文件类型
shardSize = 10 * 1024 * 1024, // shardSize = 10 * 1024 * 1024, 以10MB为一个分片
shardCount = 0; //总片数
var shardArray = new Array();
shardArray[0]=name;
shardArray[1]=size;
shardArray[2]=type;
shardArray[3]=shardSize;
shardArray[4]=shardCount;
shardArray[5]=0;//当前上传状态,0-等待上传,1-正在上传,2是上传完成
shardArray[6]=0;//已传输最后分片编号
shardArray[7]=newName;//服务器存储名称
mediaFileArray[i]=shardArray;//将每个file的分片信息放入全局数组
}
}
postFile(0,0);//第一个参数是第几个file元素,最后一个参数是从第几个分片开始上传
}
//附件完成上传计数器
var endCount=0;
//控制是否继续往服务端发送分片数据,0-继续提交,1-停止提交
var flag=0;
//文件断点续传
function postFile(fileNum,shardNum){
if(flag==0){
//计算每一片的起始与结束位置
var file = $("input[name='myfiles']")[fileNum].files[0];
var oldName;
if($("#mediaFiles").find(".video-list").eq(fileNum).find(".form-control").eq(0).val().length>0){
oldName = $("#mediaFiles").find(".video-list").eq(fileNum).find(".form-control").eq(0).val()+"#";
}else{
oldName = mediaFileArray[fileNum][0]+"#";
}
//修改时需要oldname拼接fileId
var fileNameId = $("#mediaFiles").find(".video-list").eq(fileNum).find(".form-control").eq(0).attr("id");
if(fileNameId.indexOf("modify")==0&&fileNameId.length>0&&fileNameId.split("_").length>0){
oldName = oldName + fileNameId.split("_")[1];
}
var start = shardNum * mediaFileArray[fileNum][3],
end = Math.min(mediaFileArray[fileNum][1], start + mediaFileArray[fileNum][3]);
/* //修改文件为空,但所有文件都已传输完则跳转回view
if(file==null&&endCount>=mediaFileArray.length){
window.location.href="micro/index?type="+$("#type").val();
return;
} */
//当文件不为空,当前文件所有分片都传输完时控制button显示并跳转回view
if(shardNum >= mediaFileArray[fileNum][4]&&file!=null){
$("#mediaFiles").find(".video-list").eq(fileNum).find(".progress").eq(0).addClass("hide");
$("#mediaFiles").find(".video-list").eq(fileNum).find(".stop-continue").eq(0).addClass("hide");
$("#mediaFiles").find(".video-list").eq(fileNum).find('.success').eq(0).removeClass("hide");
//如果本文件传完,开始传输下一个文件
if(fileNum<mediaFileArray.length-1&&mediaFileArray[fileNum+1][6]==0){
postFile(fileNum+1,0);
}
endCount++;
//如果所有的文件都传输完则跳转回view
if(endCount>=mediaFileArray.length){
var location = (window.location+'').split('/');
var basePath = location[0]+'//'+location[2]+'/'+location[3];
window.location.href=basePath+"/micro/index?type="+$("#type").val();
}
return;
}
//服务端URL
var requestUrl = "micro/uploadSlice";
//构造一个表单,FormData是HTML5新增的
var form = new FormData();
if(file!=null){
form.append("data", file.slice(start,end)); //slice方法用于切出文件的一部分
}
//form.append("lastModified", file.lastModified); //文件最后修改时间不支持IE
form.append("name", mediaFileArray[fileNum][7]); //文件存储名称
form.append("fileType", mediaFileArray[fileNum][2]); //文件类型
form.append("total", mediaFileArray[fileNum][4]); //总片数
form.append("index", shardNum + 1); //当前是第几片
form.append("oldName", oldName); //用户自定义文件名
form.append("seq", fileNum); //文件所处的顺序
form.append("microClassId", $("#microClassId").val()); //microClassId
//Ajax提交
$.ajax({
url: requestUrl,
type: "POST",
data: form,
async: true, //异步
processData: false, //很重要,告诉jquery不要对form进行处理
contentType: false, //很重要,指定为false才能形成正确的Content-Type
success: function(data){
//显示暂停按钮
if(start==0&&file!=null){
$("#mediaFiles").find(".video-list").eq(fileNum).find(".stop-continue").eq(0).removeClass("hide");
}
mediaFileArray[fileNum][6]=shardNum+1;
if(data!="0"){
shardNum = data++;
console.log("当前分片数:",shardNum);
var num = Math.ceil(shardNum*mediaFileArray[fileNum][3]*100 / mediaFileArray[fileNum][1]); //百分比进度
//改变进度条进度
$("#mediaFiles").find(".video-list").eq(fileNum).find(".progress").eq(0).removeClass("hide");
$("#mediaFiles").find(".video-list").eq(fileNum).find(".progress-bar").eq(0).attr("style","width: "+num+"%;");
$("#mediaFiles").find(".video-list").eq(fileNum).find(".percent").eq(0).text(num+"%");
$("#mediaFiles").find(".video-list").eq(fileNum).find(".size").eq(0).text(shardNum*10+"/"+Math.ceil(mediaFileArray[fileNum][1]/(1024 * 1024))+"M");
//通过button状态来判断是否继续上传
var text = $("#mediaFiles").find(".video-list").eq(fileNum).find(".stop-continue").eq(0).text();
if(text == "暂停上传") postFile(fileNum,shardNum);
}else{
//当修改文件为空时的处理
$("#mediaFiles").find(".video-list").eq(fileNum).find('.success').eq(0).removeClass("hide");
endCount=endCount+1;
if(endCount<mediaFileArray.length){
postFile(fileNum+1,0);
}else{
$("#mediaFiles").find(".video-list").eq(fileNum).find(".progress").eq(0).addClass("hide");
$("#mediaFiles").find(".video-list").eq(fileNum).find(".stop-continue").eq(0).addClass("hide");
$("#mediaFiles").find(".video-list").eq(fileNum).find('.success').eq(0).removeClass("hide");
var location = (window.location+'').split('/');
var basePath = location[0]+'//'+location[2]+'/'+location[3];
window.location.href=basePath+"/micro/index?type="+$("#type").val();
}
}
},
error:function(xhr,errorText,errorType){
$("#wrong_msg").text("网络错误,上传失败,请检查网络后继续上传!");
$("#tips1").modal("show");
mediaFileArray[fileNum][6]=shardNum;
$("#mediaFiles").find(".video-list").eq(fileNum).find(".stop-continue").eq(0).text("继续上传");
}
});
}else{
return;
}
}
//控制上传状态
function changeUploadStatus(that){
if($(that).text()=="暂停上传"){
var fileNum = $(that).parents(".video-list").eq(0).index();
flag=1;
$(that).text("继续上传");
mediaFileArray[fileNum][5]=0;
if(fileNum<mediaFileArray.length-1 && mediaFileArray[fileNum+1][6]==0){
$(that).parents("#mediaFiles").find(".video-list").eq(fileNum+1).find(".stop-continue").eq(0).text("暂停上传");
flag=0;
postFile(fileNum+1,mediaFileArray[fileNum+1][6]);
}
return;
}else{
var fileNum = $(that).parents(".video-list").eq(0).index();
var shardNum = mediaFileArray[fileNum][6];
for(var i=0; i<mediaFileArray.length; i++){
if(mediaFileArray[i][5]==1){
mediaFileArray[i][5]==0;
flag=1;
$(that).parents("#mediaFiles").find(".video-list").eq(i).find(".stop-continue").eq(0).text("继续上传");
}
}
flag=0;
mediaFileArray[fileNum][5]=1;
$(that).text("暂停上传");
postFile(fileNum,shardNum);
return;
}
}
//用于生成uuid
function S4() {
return (((1+Math.random())*0x10000)|0).toString(16).substring(1);
}
function guid() {
return (S4()+S4()+S4()+S4()+S4()+S4()+S4()+S4());
}
</script>复制代码
以上代码为前端控制文件上传所需的代码,之后介绍后台部分的实现
- 4.3.3 后台实现
后台实现,主要是接收文件的分片,利用前端传入唯一的新文件名称,使用NIO的方式,将分片进行合并。
Controller实现
/**
* @Description: 上传文件分片
*
* @param data
* 分片文件
* @param fileType
* 文件类型 video/avi audio/mp3
* @param name
* 文件名称(newName),由Client生成,即NewName 如
* MICRO_CLASS_1502179979829.mp4
* @param total
* 分片总数
* @param index
* 当前分片数
* @param microClassId
* 文件关联的MicroClass主键,通过先保存基本信息取得并返回(DataFile中的OwerID)
* @param oldName
* 由用户自己输入的节目名称,需要与文件对应起来,如 实现两个100年奋斗目标
* @param seq
* 文件的顺序,如第一集对应1,第二集对应2....
*
* @return index 当前合并到文件的分片数
*
* @throws Exception
*/
@RequestMapping("/uploadSlice")
@ResponseBody
public Integer uploadSlice(MultipartFile data, String fileType, String name, Integer total, Integer index,
Integer microClassId, String oldName, int seq) throws Exception {
int countFile = 0;// 记录一次保存中上传的文件数目
/**
* oldName:使用输入框中的字符串与fileId拼接,形如D1#D2 如:
* 实现两个100年奋斗目标#36,其中“实现两个100年奋斗目标”在数据库中存为OldName,36表示数据库中fileData主键
*
* D1: 可以为空,表示用户将Client获取到的文件名称删除,并且未输入任何字符串,可以为空; D2:
* 可以为空,表示新增的文件,不为空,则表示在修改页面,传回的fileID;
**/
String[] str=oldName.split("#");
String oldNameFiled=null;
String fileDataId=null;
System.out.println(str);
switch (str.length) {
case 0:
break;
case 1:
oldNameFiled = oldName.split("#")[0];
break;
case 2:
oldNameFiled = oldName.split("#")[0];
fileDataId = oldName.split("#")[1];
break;
default:
break;
}
if (total == 0) {
// 表示在修改页面,用户只可能修改了oldName,但是未修改文件
if (fileDataId != null && !fileDataId.equals("")) {
if (oldNameFiled != null && !oldNameFiled.equals("")) {
dataFileService.updateOldNameById(fileDataId, oldNameFiled);//
}
}
} else {
if (index <= total) {//说明是有分片
String dirType = fileType.split("/")[0];// 文件类型,用于创建不同的目录,如(video/audio)
String fileExt = "." + fileType.split("/")[1];// 文件扩展名,如.mp3/.mp4/.avi
System.out.println(data.getSize() + "----" + name + "-----" + total + "----" + index);
// 追加分片到已有的分片上,返回保存文件的路径,如/fileDate/video/2017/08/09
String savePath = FileUtil.randomWrite(request, data.getBytes(), name, dirType, fileExt);
if (index == 1 && savePath != null) {// 说明是新的文件的第一个分片,在数据库中创建相应的记录,并且状态为无效,等到全部上传完毕之后在修改为有效
dataFile = new DataFile();
dataFile.setOldName(oldNameFiled);
dataFile.setFileUrl(savePath);
dataFile.setNewName(name + fileExt);
dataFile.setOwerId(microClassId);
dataFile.setSeq(seq);
dataFile.setStatus(1);
dataFileService.saveDataFile(dataFile);
}
if (index == total) {// 说明已经成功上传一个文件
// 根据文件名称和OwerId来更新文件记录,把记录的状态修改为0(有效)
dataFileService.updateByNewNameAndOwerId(name+fileExt, microClassId);
countFile++;
if (countFile == 1) {// 说明已经上传成功一个文件,则吧MicroClass的状态改为0(有效);
microClassService.updateMicroClass(microClassId);// 根据microClassId来修改status
}
LOGGER.info("已上传 " + countFile + " 个文件");
}
return index++;
} else {
return 0;
}
}
return 0;
}复制代码
FileUtil中randomWrite方法实现
/**
* @Description: 分片文件追加
* @param request
* @param sliceFile 分片文件
* @param name 文件名称
* @param dirType 文件夹类型 如video/audio
* @param fileExt 文件扩展名 如.mp4/.avi ./mp3
* @return
*/
public static String randomWrite(HttpServletRequest request, byte[] sliceFile, String name, String dirType,String fileExt) {
try {
/** 以读写的方式建立一个RandomAccessFile对象 **/
//获取相对路径/home/gzxiaoi/apache-tomcat-8.0.45/webapps
String realPath=getRealPath(request);
//拼接文件保存路径 /fileDate/video/2017/08/09 如果没有该文件夹,则创建
String savePath=getSavePath(realPath,dirType);
String realName = name;
String saveFile =realPath+ savePath + realName+fileExt;
RandomAccessFile raf = new RandomAccessFile(saveFile, "rw");
// 将记录指针移动到文件最后
raf.seek(raf.length());
raf.write(sliceFile);
return savePath;
} catch (Exception e) {
e.printStackTrace();
}
return null;
}
/**
* @Description: 取得tomcat中的webapps目录 如: /home/software/apache-tomcat-8.0.45/webapps
* @param request
* @return
*/
public static String getRealPath(HttpServletRequest request) {
String realPath = request.getSession().getServletContext().getRealPath(File.separator);
realPath = realPath.substring(0, realPath.length() - 1);
int aString = realPath.lastIndexOf(File.separator);
realPath = realPath.substring(0, aString);
return realPath;
}
/**
* @Description: 获取文件保存的路径,如果没有该目录,则创建
* @param realPath 相对路径 ,如 /home/software/apache-tomcat-8.0.45/webapps
* @param fileType 文件类型 如: images/video/audio用于拼接文件保存路径,区分音视频
* @return
*/
public static String getSavePath(String realPath, String fileType) {
SimpleDateFormat year = new SimpleDateFormat("yyyy");
SimpleDateFormat m = new SimpleDateFormat("MM");
SimpleDateFormat d = new SimpleDateFormat("dd");
Date date = new Date();
String sp=File.separator + "fileDate" + File.separator +fileType + File.separator + year.format(date) + File.separator
+ m.format(date) + File.separator + d.format(date) + File.separator;
String savePath = realPath+ sp;
File folder = new File(savePath);
if (!folder.exists()) {
folder.mkdirs();
}
return sp;
}复制代码
5. 总结
本篇文章主要从实际项目出发,介绍了文件上传中所常见的一些情况,以及具体的实现。在断点续传中,需要注意的关键点:
- 浏览器端(前端)需要获取文件的大小,去计算总分片数,并且需要校验文件的合法性,在上传过程中,需要及时的获取到当前传输文件的当前分片数,以更新下一次需要传输文件的范围大小;
- 服务器端,需要根据前端传入的参数,去确定分片所属的源文件,并追加;(或者根据一定规则,创建临时目录,将属于同一文件的分片,放在同一目录,在将所有分片全部上传完毕之后<即当前分片数=总分片数>,在合并所有的分片);