`
roc08
  • 浏览: 227989 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

plupload断点续传

阅读更多

1. 简介
Plupload是不支持断点续传的,但是他支持分片上传,因此我们只需要打开其分片上传后,在文件上传之前请求一个服务器当前文件已上传的大小,如果上传大小为0则认为没有上传过,重新上传,如果上传文件大小大于0则从已上传的切片的下一个切片开始上传。
2. 修改plupload
1. 判断是否上传过
修改plupload.js,在onUploadFile方法中添加请求
if (file.name && chunkSize) {
			$.ajax({
	             type: "GET",
	             async : false ,
	             url: "upload.do",
	             data: {
	            	 name:file.name, 
	            	 askBreakpoint:true,
	            	 resumableUpload:true,
	            	 fileSize:file.size,
	            	 lastModifiedDate:file.lastModifiedDate.getTime()
	             },
	             success: function(data){
	            	 offset = Number(data);
	              }
	         });
	}

注意: 此处offset = Number(data)如果是ie9+浏览器可以不用进行number转换,但是ie8中会出现只传一片的情况,需要把offset转为number才可以
2. 添加断点续传参数
if (chunkSize) {
			formData.append("fileSize", file.size);
formData.append("lastModifiedDate",file.lastModifiedDate.getTime());
			formData.append("resumableUpload", true);
		}

3. 添加interceptor

(1)如果是请求已上传文件大小,则查找文件,返回已上传文件大小

String askBreakPoint = request.getParameter(ASK_BREAKPOINT);
if (StringUtils.isNotEmpty(resumableUpload) && StringUtils.isNotEmpty(askBreakPoint)) {
	if (StringUtils.isNotEmpty(askBreakPoint)) {
		File file = new File(getBreak_Point_TempDir(servletContext) + File.separator + getFullMD5FileName(request));
 GboatAppContext.output(file.exists() ? file.length() : 0);
		return null;
			}
		}


(2)如果是断点续传,则进行上传

if (!StringUtils.isEmpty(resumableUpload)) {
	// 当前片
String currentChunk = request.getParameter(CURRENT_CHUNK);
String chunks = request.getParameter(CHUNKS);
	// 请求上传
if (StringUtils.isNotEmpty(currentChunk)) {
File file = new File(getBreak_Point_TempDir(servletContext) + File.separator
											+ getFullMD5FileName(request));
File appendedFile = acceptedFiles.get(0);
boolean isLastChunck = Integer.valueOf(currentChunk) >= (Integer.valueOf(chunks) - 1);
// 追加:如果文件存在
if (file.exists()) {
	try {
	long size = Long.valueOf(request.getParameter(RESUMABLE_SIZE));
	long uploadedSize = file.length();
	if (!(isLastChunck && uploadedSize == size)) {
	// if last chunk and uploaded size = file size, don't append
	FileUtil.appendFile(file, appendedFile);
	}
	} catch (Exception e) {
		response.setStatus(501);
		return null;
	}
	} else {
		// 新建:如果文件不存在创建并写入
				File outFile = new File(file.getPath());
		try {									FileUtil.writeFileToDisk(acceptedFiles.get(0), outFile);
	} catch (Exception e) {
		response.setStatus(501);
		return null;
	}
}
// 如果判断当前的chunks,如果达到最大,交给action处理,如果没有达到最大返回
if (!isLastChunck) {
	GboatAppContext.output(Boolean.TRUE);
	return null;
} else {
	// 把最终上传的总文件告诉action
 	List<File> resultList = new ArrayList<File>();
	resultList.add(file);
	filesToCleanup.add(file);// 需要手动清除已经上传的文件
	params.put(inputName, resultList.toArray(new File[acceptedFiles.size()]));
}
}
}	


(3)断点续传的临时文件名根据文件名、文件大小、文件修改时间组合求散列值

private String getFullMD5FileName(HttpServletRequest request) throws Exception {
		// 文件名字,文件的修改时间,文件的大小
		String fileNameUpload = request.getParameter(RESUMABLE_FILENAME);
		String modificationDate = request.getParameter(RESUMABLE_MODIFICATION_DATE);
		String size = request.getParameter(RESUMABLE_SIZE);
		// 散列形成文件名 
		String md5FileName = MD5Util.getMD5String(fileNameUpload + size + modificationDate);
		// 散列后完整文件名
		String fullMD4FileName = md5FileName + fileNameUpload.substring(fileNameUpload.lastIndexOf("."));
		return fullMD4FileName;
	}


4. 修改上传action代码
如果是断点续传那么上传文件的fileFileName不是真正的文件名,name参数,因此需要替换下
 
String resumableUpload = request.getParameter(RESUMABLE_UPLOAD);
		if (StringUtils.isNotEmpty(resumableUpload)) {
			fileFileName = name;
		}

5. 兼容ie8 ie9
Plupload分片上传使用了html5的新特性,针对ie8 ie9等不支持html5的情况,采用flash等进行分片上传,但是plupload不建议采用flash分片上传,因为flash在分片上传读取待上传文件时不能读取一部分,只能将文件全部加载到内存中再进行分片上传,会消耗客户端内存。因此默认情况没有打开分片上传,而且根据他官方给的强制打开方法也不好使,最终修改了moxie
slice_blob: function(value) {
	return value && I.mode === 'client';
			},

由brower改为client


参考 :http://gbguanbo.iteye.com/blog/2043264
分享到:
评论

相关推荐

    spring boot + plupload实现大文件断点续传

    结合plupload这样的前端文件上传库,可以实现大文件的断点续传功能,提升用户体验并确保文件传输的可靠性。下面我们将详细探讨如何使用Spring Boot和plupload实现这一功能。 首先,plupload是一款开源的多浏览器...

    plupload java断点续传

    Plupload是一款强大的、跨浏览器的上传组件,支持多种特性,其中最引人注目的就是它的断点续传功能。在IT行业中,断点续传是一项非常实用的技术,尤其是在处理大文件上传时,如标题中提到的能处理超过4GB的大文件。...

    springMVC框架下plUpload断点续传

    在Spring MVC框架中,plUpload是一个非常实用的前端文件上传插件,尤其适用于处理大文件,如视频和图片的断点续传。该插件支持多浏览器兼容,提供了丰富的功能和自定义选项,使得文件上传体验更加友好。下面将详细...

    springboot整合plupload,实现文件批量上传、断点续传、秒传 源码

    在本文中,我们将深入探讨如何使用SpringBoot框架与Plupload工具进行集成,以实现文件的批量上传、断点续传和秒传功能。这个项目基于SpringBoot 2和Plupload 2.3.6,提供了直观的上传进度条,并且是在IntelliJ IDEA...

    支持断点续传的下载进度对话框

    断点续传技术是现代网络下载中非常关键的一项功能,尤其在大文件传输时更为重要。这个技术允许用户中断下载后,在同一位置继续下载,而无需重新开始,从而节省了大量的时间和带宽资源。在安卓系统中,实现断点续传...

    Vue.js实现大文件分片md5断点续传.docx

    在文件上传方面,Vue.js 提供了多种解决方案,包括使用 Plupload 等上传组件来实现大文件分片 md5 断点续传。 文件上传问题 在文件上传过程中,可能会遇到多种问题,如文件过大、上传超时、传输中断等。这些问题...

    文件上传[支持断点续传]Plupload+C#.vs2010

    Plupload 2.1.2 文件上传控件使用示例 开发测试环境: C#.VS2010 、 MVC4 操作系统:windows7 IIS 7.5 ...支持断点续传,设置分块越小,则断点越近 超详细代码注释,几乎每一句代码都标明注释

    Springboot上传服务源码

    在Spring Boot框架中,开发一个上传服务涉及到多个关键知识点,包括静态资源处理、自定义路由配置、请求过滤以及安全机制的实现。以下是对这些知识点的详细说明: **1. Spring Boot 静态资源处理** ...

    基于plupload上传至阿里云oss源码

    Plupload支持断点续传功能,即使上传过程中网络中断,再次上传时可以从上次断点处继续,无需重新上传整个文件,这对于大文件上传特别有用。 7. **安全性考虑**: 为了防止恶意用户利用Plupload上传非法文件,应...

    基于SpringBoot的文件上传系统,前后端分离,单文件上传,多文件上传,大文件上传,断点续传,文件秒传,图片上传

    基于SpringBoot的文件上传系统,前后端分离,单文件上传,多文件上传,大文件上传,断点续传,文件秒传,图片上传 项目经过严格测试,确保可以运行! 采用前后端分离的方式进行开发,实现了几种常用的文件上传功能...

    修改plupload,上传文件,支持断点,可上传超过2G

    标题 "修改plupload,上传文件,支持断点,可上传超过2G" 指向的是一个关于增强开源JavaScript文件上传组件plupload的功能,使其具备断点续传和处理大文件(超过2GB)的能力。plupload是一款强大的多浏览器、多后端...

    java_分段上传_断点续传_超大附件上传spring-fileupload-plupload-mysql

    在mysql中创建 upload 数据库,导入sql文件,运行项目,修改 database.java 文件下的数据库密码,就实现了超大附件的分片上传,每个方法的功能都写着注解呢,个根据需要做断点续传功能! 后端导了fileupload的jar包 ...

    Html5大文件断点续传实现方法

    HTML5提供了支持断点续传的工具和库,如`resumable.js`和`Plupload`。`resumable.js`是一个轻量级的JavaScript库,专门用于实现大文件的断点续传。其主要配置选项包括: - `target`: 上传的服务器端URL。 - `chunk...

    MyUploader-后端:单文件上传,多文件上传,大文件上传,断点续传,文件秒传,图片上传

    单文件上传,多文件上传,大文件上传,断点续传,文件秒传,图片上传 前端项目地址: : 简介 预先采用vue.js + plupload + element-ui实现了文件在浏览器端的发送,而采用了spring boot + spring + spring mvc + ...

    plupload_1_5_7

    针对大型文件,Plupload 支持断点续传功能。如果上传过程中因网络问题中断,用户可以在恢复连接后从上次中断的地方继续上传,而不必重新开始。 4. **预览功能**: 在上传前,Plupload 可以显示选定文件的预览,...

    Plupload 上传.net MVC 上传示例

    在.NET MVC框架中,我们可以利用Plupload来构建用户友好的文件上传功能,提供断点续传、批量上传、进度条显示等特性。本示例将详细介绍如何在.NET MVC项目中集成并使用Plupload。 1. **Plupload组件介绍** ...

    plupload_plupload进度_php_Plupload_

    关于“上传分块”,Plupload支持断点续传和大文件分块上传。这种方式将大文件分割成多个小块,逐个上传,即使上传过程中网络中断,也可以从上次失败的地方继续,而不需要重新开始。这对于网络不稳定或文件大小超过...

    Plupload多文件上传(调整后)

    综上所述,"Plupload多文件上传(调整后)"项目是为了解决Struts2环境中大文件上传的问题,它利用了Plupload的分块上传和断点续传功能,同时可能优化了Servlet和Struts2的文件上传处理逻辑,以适应大文件的上传需求。...

Global site tag (gtag.js) - Google Analytics