JAVA WEB怎么实现大文件上传

javaweb上传文件

上传文件的jsp中的部分

上传文件同样可以使用form表单向后端发请求，也可以使用 ajax向后端发请求

 1.通过form表单向后端发送请求

改进后的代码不需要form标签，直接由控件来实现。开发人员只需要关注业务逻辑即可。JS中已经帮我们封闭好了

 this.post_file = function ()

 {

 $.each(this.ui.btn, function (i, n) { n.hide();});

 this.ui.btn.stop.show();

 this.State = this.Config.state.Posting;//

 this.app.postFile({ id: this.fileSvr.id, pathLoc: this.fileSvr.pathLoc, pathSvr:this.fileSvr.pathSvr,lenSvr: this.fileSvr.lenSvr, fields: this.fields });

 };

通过监控工具可以看到控件提交的数据，非常的清晰，调试也非常的简单。

2.通过ajax向后端发送请求

   $.ajax({

 url : "${pageContext.request.contextPath}/UploadServlet",

 type : "POST",

 data : $( '#postForm').serialize(),

 success : function(data) {

 $( '#serverResponse').html(data);

 },

 error : function(data) {

 $( '#serverResponse').html(data.status + " : " + data.statusText + " : " + data.responseText);

 }

 });

ajax分为两部分，一部分是初始化，文件在上传前通过AJAX请求通知服务端进行初始化操作

 this.md5_complete = function (json)

 {

 this.fileSvr.md5 = json.md5;

 this.ui.msg.text("MD5计算完毕，开始连接服务器...");

 this.event.md5Complete(this, json.md5);//biz event

 var loc_path = encodeURIComponent(this.fileSvr.pathLoc);

 var loc_len = this.fileSvr.lenLoc;

 var loc_size = this.fileSvr.sizeLoc;

 var param = jQuery.extend({}, this.fields, this.Config.bizData, { md5: json.md5, id: this.fileSvr.id, lenLoc: loc_len, sizeLoc: loc_size, pathLoc: loc_path, time: new Date().getTime() });

 $.ajax({

 type: "GET"

 , dataType: 'jsonp'

 , jsonp: "callback"//自定义的jsonp回调函数名称，默认为jQuery自动生成的随机函数名

 , url: this.Config["UrlCreate"]

 , data: param

 , success: function (sv)

 {

 _this.svr_create(sv);

 }

 , error: function (req, txt, err)

 {

 _this.Manager.RemoveQueuePost(_this.fileSvr.id);

 alert("向服务器发送MD5信息错误！" + req.responseText);

             _this.ui.msg.text("向服务器发送MD5信息错误");

 _this.ui.btn.cancel.show();

 _this.ui.btn.stop.hide();

 }

 , complete: function (req, sta) { req = null; }

 });

 };

在文件上传完后向服务器发送通知

 this.post_complete = function (json)

 {

 this.fileSvr.perSvr = "100%";

 this.fileSvr.complete = true;

 $.each(this.ui.btn, function (i, n)

 {

 n.hide();

 });

 this.ui.process.css("width", "100%");

 this.ui.percent.text("(100%)");

 this.ui.msg.text("上传完成");

 this.Manager.arrFilesComplete.push(this);

 this.State = this.Config.state.Complete;

 //从上传列表中删除

 this.Manager.RemoveQueuePost(this.fileSvr.id);

 //从未上传列表中删除

 this.Manager.RemoveQueueWait(this.fileSvr.id);

 var param = { md5: this.fileSvr.md5, uid: this.uid, id: this.fileSvr.id, time: new Date().getTime() };

 $.ajax({

 type: "GET"

 , dataType: 'jsonp'

 , jsonp: "callback"//自定义的jsonp回调函数名称，默认为jQuery自动生成的随机函数名

 , url: _this.Config["UrlComplete"]

 , data: param

 , success: function (msg)

 {

  _this.event.fileComplete(_this);//触发事件

  _this.post_next();

 }

 , error: function (req, txt, err) { alert("文件-向服务器发送Complete信息错误！" + req.responseText); }

 , complete: function (req, sta) { req = null; }

 });

 };

这里需要处理一个MD5秒传的逻辑，当服务器存在相同文件时，不需要用户再上传，而是直接通知用户秒传

 this.post_complete_quick = function ()

 {

 this.fileSvr.perSvr = "100%";

 this.fileSvr.complete = true;

 this.ui.btn.stop.hide();

 this.ui.process.css("width", "100%");

 this.ui.percent.text("(100%)");

 this.ui.msg.text("服务器存在相同文件，快速上传成功。");

 this.Manager.arrFilesComplete.push(this);

 this.State = this.Config.state.Complete;

 //从上传列表中删除

 this.Manager.RemoveQueuePost(this.fileSvr.id);

 //从未上传列表中删除

 this.Manager.RemoveQueueWait(this.fileSvr.id);

 //添加到文件列表

 this.post_next();

 this.event.fileComplete(this);//触发事件

 };

这里可以看到秒传的逻辑是非常 简单的，并不是特别的复杂。

 var form = new FormData();

 form.append("username","zxj");

 form.append("avatar",file);

 //var form = new FormData($("#postForm")[0]);

 $.ajax({

 url:"${pageContext.request.contextPath}/UploadServlet",

 type:"post",

 data:form,

 processData:false,

 contentType:false,

  success:function(data){

 console.log(data);

 }

 });

java部分

文件初始化的逻辑，主要代码如下

FileInf fileSvr= new FileInf();

fileSvr.id = id;

fileSvr.fdChild = false;

fileSvr.uid = Integer.parseInt(uid);

fileSvr.nameLoc = PathTool.getName(pathLoc);

fileSvr.pathLoc = pathLoc;

fileSvr.lenLoc = Long.parseLong(lenLoc);

fileSvr.sizeLoc = sizeLoc;

fileSvr.deleted = false;

fileSvr.md5 = md5;

fileSvr.nameSvr = fileSvr.nameLoc;

//所有单个文件均以uuid/file方式存储

PathBuilderUuid pb = new PathBuilderUuid();

fileSvr.pathSvr = pb.genFile(fileSvr.uid,fileSvr);

fileSvr.pathSvr = fileSvr.pathSvr.replace("\","/");

DBConfig cfg = new DBConfig();

DBFile db = cfg.db();

FileInf fileExist = new FileInf();

boolean exist = db.exist_file(md5,fileExist);

//数据库已存在相同文件，且有上传进度，则直接使用此信息

if(exist && fileExist.lenSvr > 1)

{

 fileSvr.nameSvr = fileExist.nameSvr;

 fileSvr.pathSvr  = fileExist.pathSvr;

 fileSvr.perSvr  = fileExist.perSvr;

 fileSvr.lenSvr  = fileExist.lenSvr;

 fileSvr.complete = fileExist.complete;

 db.Add(fileSvr);

 //触发事件

 up6_biz_event.file_create_same(fileSvr);

}//此文件不存在

else

{

 db.Add(fileSvr);

 //触发事件

 up6_biz_event.file_create(fileSvr);

 FileBlockWriter fr = new FileBlockWriter();

 fr.CreateFile(fileSvr.pathSvr,fileSvr.lenLoc);

}

接收文件块数据，在这个逻辑中我们接收文件块数据。控件对数据进行了优化，可以方便调试。如果用监控工具可以看到控件提交的数据。

boolean isMultipart = ServletFileUpload.isMultipartContent(request);

FileItemFactory factory = new DiskFileItemFactory();  

ServletFileUpload upload = new ServletFileUpload(factory);

List files = null;

try

{

 files = upload.parseRequest(request);

}

catch (FileUploadException e)

{// 解析文件数据错误 

 out.println("read file data error:" + e.toString());

 return;

}

FileItem rangeFile = null;

// 得到所有上传的文件

Iterator fileItr = files.iterator();

// 循环处理所有文件

while (fileItr.hasNext())

{

 // 得到当前文件

 rangeFile = (FileItem) fileItr.next();

 if(StringUtils.equals( rangeFile.getFieldName(),"pathSvr"))

 {

 pathSvr = rangeFile.getString();

 pathSvr = PathTool.url_decode(pathSvr);

 }

}

boolean verify = false;

String msg = "";

String md5Svr = "";

long blockSizeSvr = rangeFile.getSize();

if(!StringUtils.isBlank(blockMd5))

{

 md5Svr = Md5Tool.fileToMD5(rangeFile.getInputStream());

}

verify = Integer.parseInt(blockSize) == blockSizeSvr;

if(!verify)

{

 msg = "block size error sizeSvr:" + blockSizeSvr + "sizeLoc:" + blockSize;

}

if(verify && !StringUtils.isBlank(blockMd5))

{

 verify = md5Svr.equals(blockMd5);

 if(!verify) msg = "block md5 error";

}

if(verify)

{

 //保存文件块数据

 FileBlockWriter res = new FileBlockWriter();

 //仅第一块创建

 if( Integer.parseInt(blockIndex)==1) res.CreateFile(pathSvr,Long.parseLong(lenLoc));

 res.write( Long.parseLong(blockOffset),pathSvr,rangeFile);

 up6_biz_event.file_post_block(id,Integer.parseInt(blockIndex));

 JSONObject o = new JSONObject();

 o.put("msg", "ok");

 o.put("md5", md5Svr); 

 o.put("offset", blockOffset);//基于文件的块偏移位置

 msg = o.toString();

}

rangeFile.delete();

out.write(msg);

注：

1. 上面的java部分的代码可以直接使用，只需要将上传的图片路径及收集数据并将数据写入到数据库即可

2. 上面上传文件使用到了字节流，其实还可以使用别的流，这个需要读者自己在下面完善测试

3. BeanUtils是一个工具 便于将实体对应的属性赋给实体

4. 上传文件不能使用 request.getParameter("")获取参数了，而是直接将request解析，通过判断每一项是文件还是非文件，然后进行相应的操作（文件的话就是用流来读取，非文件的话，暂时保存到一个map中。）

后端代码逻辑大部分是相同的，目前能够支持MySQL,Oracle,SQL。在使用前需要配置一下数据库，可以参考我写的这篇文章：http://blog.ncmem.com/wordpress/2019/08/12/java-http%E5%A4%A7%E6%96%87%E4%BB%B6%E6%96%AD%E7%82%B9%E7%BB%AD%E4%BC%A0%E4%B8%8A%E4%BC%A0/

0人点赞

随笔