文件断点续传前端,web上传文件断点续传
大文件分块
常见的web服务器在向服务器提交数据时有大小限制。大于特定大小文件的服务器端将返回拒绝消息。当然，web服务器都提供了配置文件的可能修改限制的大小。还有一些方法可以通过修改web服务器来限制文件大小，从而为iis上传大文件。然而，这给web服务器的安全性带来了问题。攻击者很容易发送一个大数据包，直接把你的web服务器拖死。
现在针对主流的大文件上传方式，我们把大文件分块。例如，对于一个100M的文件，它被2M分成50个块。然后依次把每个文件上传到服务器，上传完成后再把服务器上的文件合并。
在web上上传大文件，其核心是文件分区。在Html5文件API出现之前，需要在web上实现文件块传输。只有flash或Activex可以用来阻止文件。
在Html5下，我们可以通过file的slice方法直接屏蔽文件。例如：XML/HTML代码将内容复制到剪贴板file.slice(0，1000)；file.slice(1000，2000)；file.slice(2000，3000)；然后通过XMLHttpRequest异步上传到服务器。Html5 上传文件类库
如果你有兴趣，有时间，当然可以用html5的文件API自己实现。我在网上找到了以下两个支持html5的类库。
git附带的resumable.js的地址：https://github.com/23/resumable.js
重载http://plupload.com/
Resumable是一个纯html5上传类库。
Pludload是一款支持html5、Flash、Silverlight和HTML4的浏览器，它会自动判断浏览是否支持HTML5，但不支持其他上传方式。
我测试了resumable和Pludload都支持html5块上传文件。下来觉得可恢复的比较合适。我们选resumable来介绍一下吧。
resumable.js断点上传使用介绍
主要配置介绍：JavaScript代码将内容复制到剪贴板varr=new resumable({ target:/test/upload ，chunk size: 1 * 1024 * 1024，同时上传：4，testchunks: true，throttlesprogresscalbacks:1，method: octet}) ChunkSize chunk文件大小，以字节为单位
可以允许通过同时上传多个文件块的同时上传来同时上传文件块的过程的数量。
先用get方法测试区块中的前一个文件块是否发送了文件信息，检查文件是否已经上传。
当设置为true时，通过配置testChunks的节点来实现可恢复断点的上传。Resumable会先发送一个get请求，如果http状态返回200。认为当前块已经上传，然后进行下一块的get请求。如果http状态不是200，则当前数据块数据包将通过post发送，用于文件数据块上传。
将testChunks设置为true，每次上传都会添加一个get请求，如果我们已经知道上次上传中断前文件的块数。下次直接从中断块数上传就行了。这可以减少每个块一次的http get请求。
针对这种需求，我修改了resumable的源代码，在resumable中的file对象上增加了一个startchunkindex属性，默认为0。用于设置上传当前文件的块。这样我们只需要在文件上传之前向服务器进行一次查询(查询当前文件上传到哪个块)，返回最后上传的文件块的索引。然后将索引值设置为文件的startchunkindex属性，就可以从最后一个断开连接的文件块上传了。
调用方法：JavaScript代码将内容复制到剪贴板//handlefileaddeventr . on( file added ，function(file){ file . startchunkindex=0；//设置开始上传当前文件的块数。详见附件中的演示。收尾工作
所有文件块上传完毕后，最后一项工作就是合并保存文件。对于可恢复的附件，上传。net实现，包括简单的文件合并功能。其他语言的演示也可以从resumable的git下载。
为了简单起见，演示示例只将文件存储在本地计算机中。在真实的生产环境中。一般要放在单独的文件服务器上(前台web通过ftp或者文件夹共享的方式上传到文件服务器)，然后对上传的文件进行分发、镜像或者处理(比如视频压缩)。当然，最好是在分布式文件系统中。目前，把它放在Hadoop分布式文件系统(HDFS)中是一个不错的方案。
演示
Vs2012 Html5上传演示下载
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。