1.大文件上传的解决思路
1.文件切片:
把一个大文件转换成二进制内容,然后按照一个固定的大小对二进制内容进行切割,得到多个小文件,然后循环上传所有的小文件。在js中,文件File对象是Blob对象的子类,可以使用slice()方法完成对文件的切割;
2.文件合并:
当所有小文件上传完成,调用接口通知后端把所有的文件按编号进行合并,组成大文件;
3.并发控制:
结合Promise.race和异步函数实现,限制多个请求同时并发的数量,防止浏览器内存溢出;
4.断点续传:
把所有上传失败的小文件加入一个数组里面,在所有小文件都上传结束(成功和失败都算结束)之后再上传一次上传失败了的小文件,反复执行这一步,直到所有小文件都上传成功,可以通过递归实现。
2.代码实现 - 前端部分:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=s, initial-scale=1.0">
<title>Document</title>
<script src="https://cdn.bootcdn.net/a