关于WebUploader插件中断点续传的思考

最新推荐文章于 2024-07-03 14:14:12 发布
最新推荐文章于 2024-07-03 14:14:12 发布
阅读量833 收藏
点赞数
分类专栏： java 文章标签： Java WebUploader 断点续传
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qianhangkang/article/details/79512484
版权

最近回想了以前做过的关于 工具上传下载管理系统 的项目，其中项目要求能够断点续传。


当时使用了前端使用了WebUploader这个插件进行文件的分片、MD5计算，后端则使用了SpringMVC的框架，今天重新想了想，感觉有个地方可以重新优化，故此记录。


先放个刚刚用Visio做的流程图



之前在分片上传时是直接定位到文件的 分片块数*分片大小 的offset的位置进行写入，这就会造成如果该区域的数据已经上传过了，那么会重复写入，造成资源的浪费。


此次的优化在于，写入之前会判断是否已经上传过该区块，所以，刚开始的时候，每当写入一个区块后，都会计算其MD5写入redis或者配置文件中，当发生断点续传后，如果该区块已经写入，则会跳过该区块。


有时间我会改进代码并贴出。。。

当年写的时候参考了以下链接点击打开链接


qianhangkang
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
大文件上传 webuploader插件 进度条 断点续传
12-11
WebUploader是一款优秀的JavaScript插件，专门用于解决大文件上传的问题，它支持进度条显示以及断点续传功能，确保用户可以高效且稳定地上传大容量文件。以下是对这些知识点的详细说明： 1. **大文件上传**： 大...
WebUploader大文件上传解决方案支持分片断点上传
Mr_Zang666的博客
03-30 833
文件上传是一个老生常谈的话题了，在文件相对比较小的情况下，可以直接把文件转化为字节流上传到服务器，但在文件比较大的情况下，用普通的方式进行上传，这可不是一个好的办法，毕竟很少有人会忍受，当文件上传到一半中断后，继续上传却只能重头开始上传，这种让人不爽的体验。断点续传是在下载或上传时，将下载或上传任务（一个文件或一个压缩包）人为的划分为几个部分，每一个部分采用一个线程进行上传或下载，如果碰到网络故障，可以从已经上传或下载的部分开始继续上传或者下载未完成的部分，而没有必要从头开始上传或者下载。
WebUploader 超大文件上传和断点续传的实现
Mr_Zang666的博客
05-12 269
但是在很多情况下，平台运营方并没有大文件上传和断点续传的开发经验，往往在网上找一些简单的PHP或者Java程序来实现基本的上传功能，然而在实际使用中会发现，这些基于脚本语言实现的上传功能模块性能很弱，一是不支持2GB以上的内容上传；二是无法支持断点续传；它支持4GB以上超大文件上传和断点续传，支持Windows和Linux服务器平台，支持任意格式的文件上传，尤其适合大的视频网站应用。随着视频网站和大数据应用的普及，特别是高清视频和4K视频应用的到来，超大文件上传已经成为了日常的基础应用需求。
JS使用WEBUPLOADER做大文件的分块和断点续传
alisky119的博客
07-03 699
百度WEBUPLOADER上传视频等大文件，WEBUPLOAD组件实现文件上传功能和下载功能，JS大文件切片上传，断点续传实现DEMO，前端上传大文件的解决方案，前端上传大文件处理（切片、断点续传），前端大文件上传优化方案——分片上传，vue大文件上传解决方案，vue大文件上传解决方案10G，vue大文件上传解决方案50G，vue大文件上传解决方案100G，html5如何实现大文件断点续传、秒传，id=e1f49f3e1d4742e19135e00bd41fa3de。
基于Web Uploader实现断点上传
知易行难
07-09 362
根据Web Uploader实现文件断点上传功能
用WebUploader 实现断点续传 (HTTP)
weixin_45525177的博客
11-16 300
/每一个对象自带一个fields幅本。//将父节点排在前面。this.root.put("f_nameLoc", "根目录");//构建目录映射表(id,folder)//json obj，服务器文件信息。}//是根目录->添加根目录。//是子目录->添加根目录。//按层级顺序排列目录。
断点WEBUPLOADER-断点续传-大文件断点上传
alisky119的博客
03-30 253
需求：用的是webuploader，前端的话VUE2,VUE3都用了，要求支持断点续传，支持分片上传，支持分块上传，因为上传的文件比较大，支持20G文件上传和续传，支持秒传，参考：http://www.ncmem.com/doc/view.aspx?接口地址分别对应：文件初始化，文件数据上传，文件进度，文件上传完毕，文件删除，文件夹初始化，文件夹删除，文件列表。将up6组件复制到项目中。示例中已经包含此目录。
关于webuploader插件使用过程遇到的小问题
01-19
本文为大家解决webuploader上传插件如何自定义参数的问题，供大家参考，具体内容如下 大致架构： 　前端:html5+ajax 　后端：java （struts框架相关） 碰到问题： 后台coder给我提供一个接口./file/uploader.do?...
webuploader断点续传
03-07
断点续传是一种在网络上传输大文件时非常有用的技术，它允许用户在文件上传中断后从上次中断的地方继续上传，而不需要重新开始整个过程。这对于网络不稳定或者文件体积庞大的情况尤其重要。 1、**核心参数配置**： ...
mongodb存取文件、webuploader断点续传，支持秒传，openOffice转pdf实现在线预览
01-24
利用mongodb存储文件，前台使用百度webuploader的文件md5实现断点续传，一次上传，下次秒传，解决文件重复问题，避免数据冗余，文件上传后支持下载， 特定格式支持在线预览，office转pdf后前台新页面显示pdf，相关...
使用webuploader组件实现大文件分片上传，断点续传
weixin_45525177的博客
11-08 191
参考文章：http://blog.ncmem.com/wordpress/2023/11/08/%e4%bd%bf%e7%94%a8webuploader%e7%bb%84%e4%bb%b6%e5%ae%9e%e7%8e%b0%e5%a4%a7%e6%96%87%e4%bb%b6%e5%88%86%e7%89%87%e4%b8%8a%e4%bc%a0%ef%bc%8c%e6%96%ad%e7%82%b9%e7%bb%ad%e4%bc%a0-2/如下图，是上传文件时所创建的临时目录及目录中的临时文件；
webUploader实现大文件分片，断点续传
weixin_45525177的博客
11-17 93
参考文章：http://blog.ncmem.com/wordpress/2023/11/17/webuploader%e5%ae%9e%e7%8e%b0%e5%a4%a7%e6%96%87%e4%bb%b6%e5%88%86%e7%89%87%ef%bc%8c%e6%96%ad%e7%82%b9%e7%bb%ad%e4%bc%a0-2/公司现在的业务需求是要上传一个大文件，上一次写了一篇博客，做了一个简单的文件上传，支持单文件，大型文件上传。其实重要的也就是，页面js文件，和后台接口服务，MD5工具类。
webuploader 断点续传
dxyzhbb的博客
10-10 865
webuploader 实现 断点续传 webuploader是百度开发的上传文件前端控件。可支持html5和flash，因此对浏览器的兼容比较好。因为需要用到ie8，ie8不支持html5， 所以必须支持flash上传。 断点续传原理： 1）将大分件分片上传，比如每次传送3m。 2）后台在上传完毕后将分片上传的文件合并为一个文件。 技术要求： 1）前端页面支持分件拆分读取。html5是支持的。I...
vue中使用webuploader做断点续传
nanjo_yoshino0712的博客
07-18 1036
通过使用webuploader插件，去做断点续传，解决大文件上传失败、失败后需要重头上传、暂停上传等问题
webUploader---实现大文件断点续传
weixin_52041354的博客
02-28 334
一、概述 所谓断点续传，其实只是指下载，也就是要从文件已经下载的地方开始继续下载。在以前版本的HTTP协议是不支持断点的，HTTP/1.1开始就支持了。一般断点下载时才用到Range和Content-Range实体头。HTTP协议本身不支持断点上传，需要自己实现。 二、Range 用于请求头中，指定第一个字节的位置和最后一个字节的位置，一般格式： Range:用于客户端到服务端的请求，可以通过改字段指定下载文件的某一段大小及其单位，字节偏移从0开始。典型格式： R...
C# WebUploader文件分片上传、断点续传
个人记录
04-21 307
C# WebUploader文件分片上传、断点续传
php-webuploader+php如何实现分片+断点续传
weixin_52041354的博客
10-25 263
分块上传，分块处理逻辑应该是最简单的逻辑了，up6已经将文件进行了分块，并且对每个分块数据进行了标识，这些标识包括文件块的索引，大小，偏移，文件MD5，文件块MD5（需要开启）等信息，服务端在接收这些信息后便可以非常方便的进行处理了。实现原理，就是在每个文件上传前，就获取到文件MD5取值，在上传文件前调用接口（/index/checkFileMd5，没错也是秒传的检验接口）如果获取的文件状态是未完成，则返回所有的还没上传的分块的编号，然后前端进行条件筛算出哪些没上传的分块，然后进行上传。
SpringBoot实现断点续传
人生就像一场戏
12-15 7137
大文件面临的问题 1. 上传速度慢 -- 应对: 分块上传 2. 上传文件到一半中断后，继续上传却只能重头开始上传 -- 应对: 断点续传 3. 相同文件未修改再次上传, 却只能重头开始上传 -- 应对: 秒传 分片上传 1、什么分片上传 分片上传，就是将所要上传的文件，按照一定的大小，将整个文件分隔成多个数据块（我们称之为Part）来进行分别上传，上传完之后再由服务端对所有上传的文件进行汇总整合成原始的文件 2、分片上传适用场景 ...
VUE+大文件上传控件
最新发布
alisky119的博客
07-03 773
百度上传插件WEB UPLOADER，使用WEBUPLOADER组件实现大文件分片上传，断点续传，百度WEBUPLOADER开源上传控件，百度WEBUPLOADER上传文件夹技术，WEBUPLOADER上传文件夹技术，JS实现文件夹的多线程上传和下载，JS实现文件夹的加密上传和下载，JS怎么实现文件夹的上传和下载，vue实现文件夹的上传和下载。也不一定，反正不管用哪个框架都是用。接口地址分别对应：文件初始化，文件数据上传，文件进度，文件上传完毕，文件删除，文件夹初始化，文件夹删除，文件列表。
webuploader实现断点续传
04-24
WebUploader 是一款基于 HTML5 的文件上传组件，它可以实现文件的断点续传功能。具体实现步骤如下： 1. 在前端界面上，引入 WebUploader 组件并设置相应参数，例如设置文件大小、文件类型、上传路径等。 2. 在后端服务器上，接收上传文件的请求，并实现文件的分块上传、暂停上传、续传等功能。可以使用第三方的上传组件，例如百度云存储、七牛云存储等。 3. 在前端界面上，实现断点续传的功能。当用户在上传过程中中断上传，再次上传同一文件时，可以通过某种方式记录上传进度，重新开始上传过程。 总之，通过 WebUploader 实现文件的断点续传功能，可以提高上传效率，节约带宽资源，提升用户体验。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值