前端大文件上传

119 阅读1分钟
*文件切片  webworker  断点续传  进度展示  并发控制*

文件切片

- 获取上传的文件
  -  方式一:input选择框
    - 设置多选文件
      multiple="multiple"
    - 获取选择的文件
      event.target.files

  -  方式二:drag拖拽
    -  获取选择的文件
       event.dataTransfer.items
- 文件切片
  利用file.size做循环,通过file.solice切割获取到的二进  制流文件,push到数组中,得到一组切片数组

image.png

webworker通信

image.png

断点续传

image.png

进度展示

image.png

并发控制

image.png