前言:
在我们日常开发中,上传技术是很常见的,但是当我们需要进行大文件上传的时候,可能会遇到一些问题:
1.上传时间比较久
2.中间一旦出错就需要重新上传
3.一般服务器端会对文件的大小进行限制
这时候,我们就可以对大文件进行分片上传的操作,减少失败率。同时在分片上传的基础上,还可以实现断点续传、秒传、展示分片上传进度的效果。
一:总体思路
前端:
1.根据文件内容分片Web Workers(额外线程计算分片),SparkMD5计算文件哈希值(唯一性) 。
2.上传之前先调用一个vertify接口,判断文件是否已经存在,以及是否存在已上传的分片。
3.vertify如果得到信息,文件已经上传,前端直接终止上传流程,进度直接赋值100%(秒传)。
4.vertify接口如果得到文件已经上传的分片,在上传之前先过滤掉已上传的分片,只上传剩下的分片(断点续传)。
5.上传保持并发上传,可支持设置最多并发数,加快上传速度。
6.上传完之后,调用merge接口,告诉后台将分片合并为文件,删除临时分片。
后端:
1.提供文件目录,用来保存上传的文件(无服务器的情况)。
2.根据每一个文件的哈希值单独创建一个目录,目录下面保存着文件的分片。
3.提供给前端vertify接口,根据文件哈希值扫描目录下已存在的分片,并将信息告诉前端(文件是否已经存在,是否存在已经上传过的分片)。
4.前端调用merge接口时,后端将目录文件下的分片合并,并删除临时目录和分片。
二:关键步骤代码(前端)
1.文件分片
2.计算文件哈希值
3.上传之前调用vertify接口
4.并发上传并返回上传进度