JavaScript文件分片上传,断点续传如何实现?

JavaScript011

JavaScript文件分片上传,断点续传如何实现?,第1张

public class FileInf {

public FileInf(){}

public String id=""

public String pid=""

public String pidRoot=""

/** * 表示当前项是否是一个文件夹项。*/

public boolean fdTask=false

// /// 是否是文件夹中的子文件 /// </summary>

public boolean fdChild=false

/** * 用户ID。与第三方系统整合使用。*/

public int uid=0

/** * 文件在本地电脑中的名称 */

public String nameLoc=""

/** * 文件在服务器中的名称。 */

public String nameSvr=""

/** * 文件在本地电脑中的完整路径。示例:D:\Soft\QQ2012.exe */

public String pathLoc=""

/** * 文件在服务器中的完整路径。示例:F:\\ftp\\uer\\md5.exe */

public String pathSvr=""

/** * 文件在服务器中的相对路径。示例:/www/web/upload/md5.exe */

public String pathRel=""

/** * 文件MD5*/

public String md5=""

/** * 数字化的文件长度。以字节为单位,示例:120125*/

public long lenLoc=0

/** * 格式化的文件尺寸。示例:10.03MB */

public String sizeLoc=""

/** * 文件续传位置。 */

public long offset=0

/** * 已上传大小。以字节为单位 */

public long lenSvr=0

/** * 已上传百分比。示例:10% */

public String perSvr="0%"

public boolean complete=false

public Date PostedTime = new Date()

public boolean deleted=false

/** * 是否已经扫描完毕,提供给大型文件夹使用,大型文件夹上传完毕后开始扫描。 */

public boolean scaned=false

}

1、文件过大会导致带宽资源紧张,请求速度下降 ;

2、如果上传过程中服务中断、网络中断 、页面崩溃,可能会导致文件重新开始上传。

前端选择文件后上传,后端在处理文件过程中,首先会将文件加载到 运行内存中 ,之后再调用相应的API进行 写入硬盘 内存的操作,完成整个文件的上传。

但这样直接上传文件,可能会因为某个环节出了问题导致整个流程的雪崩,所以大文件直接上传是不可取的。

解决问题最好办法是 分片断点续传 ,该方式主要是针对 大文件(比如100M以上的文件)

顾名思义就是 断点 续传

在文件上传过程中,将一个要上传的文件 分成N块 ,然后使用 多线程并发多块上传 ,因为某种原因导致上传被中断或暂停,此时中断或暂停的位置就成为 断点

前端每上传一片,将会被加载到 运行内存中 ,加载完毕后再写入硬盘,此时运行内存的临时变量会被释放,然后此临时变量会被下一片占用,再进行写入,释放...

意思是指从中断的位置继续上传剩下的部分文件,而不是从头开始上传。

上传完毕后,在服务端进行合并(合并的操作是在后端进行的,前端只是调用接口,合并的方式是由后端决定的,到底是上传一片就合并一片,或者是上传所有的之后整体进行合并)。

方式:

html5z之前的方式是 flash activeX

html5提供了文件二进制流进行分割的slice方法。

文件的分片,一般在2-5M之间。这一步得到了每一片文件的内容、每一块的序号、每一块的大小、总块数等数据。

这里提供了两个方法;一种是用SparkMD5.hashBinary( ) 直接将整个文件的二进制码传入直接返回文件的md5、这种方法对于小文件会比较有优势——简单并且速度快。

另一种方法是利用js中File对象的slice( )方法(File.prototype.slice( ))将文件分片后逐个传入spark.appendBinary( )方法来计算、最后通过spark.end( )方法输出结果,很明显,这种方法对于大型文件会非常有利——不容易出错,并且能够提供计算的进度信息

第一种方式:

第二种方式