切片上传断点续传

// 获取文件
const uoload=async file=>{
// 存储已上传的切片
  let already=[],
      // 用于发送请
      data=null,
      {HASH,suffix}= await changeBuffer(file)
// 获取已上传的切片信息
  try {
    data=await instance.get('/请求地址',{
      params:{
        HASH
      }
    })
    if(data.code===0){
      already=data.fileList
    }
  }catch (e) { }

// 文件切片处理两种固定数量&固定大小
// 1024*100=100KB,1024*1024*2=2MB
  let max=1024*100,
      // 向上取整
      count=Math.ceil(file.size / max),
      // 记录之前上传了多少切片
      index=0,
      // 存储新上传的所有切片
      chunks=[]
  // 判断count一共是否超过100片,超过就当100片处理
  if(count > 100){
    max=file.size / 100
    count=100
  }
  while (index < count){
    chunks.push({
      file:file.slice(index * max,(index + 1)*max),
      filename:`${HASH}_${index+1}.${suffix}`
    })
    index++
  }

  //把每个切片都上传到服务器
  chunks.forEach(chunk=>{
    // 以上传无需再上传
    if(already.length > 0 && already.includes(chunk.filename)){
      complate()
      return
    }
    let fm = new FormData
    fm.append('file',chunk.file)
    fm.append('filename',chunk.filename)
    instance.post('/请求地址',fm).then(data=>{
      if(data.code===0){
        complate()
        return
      }
      return Promise.reject(data.codeText)
    })
  })
}
// 工具函数
const changeBuffer=file=>{
  return new Promise(resolve => {
    // 转成buffer格式数据
    let fileReader = new FileReader()
    fileReader.readAsArrayBuffer(file)
    fileReader.onload=ev => {
      let buffer=ev.target.result,
          spark=new SparkMD5.ArrayBuffer(),
          HASH,
          suffix;
      spark.append(buffer)
      // HASH加密
      HASH=spark.end()
      // 文件后缀
      suffix=/\.([a-zA-Z0-9]+)$/.exec(file.name)[1]
      resolve({
        buffer,
        HASH,
        suffix,
        // 整体文件名
        filename:`${HASH}.${suffix}`
      })
    }
  })
}

// 上传成功
const complate=async(index,count)=>{
  // 管理进度条
  index++
  // 控制进度条走到100% 某某=`${index/count*100}%`

  // 当所有切片都上传成功,我们会合并切片
  if(index < count) return;
  // 进度条设置某某=100%
  try {
    data= await instance.post('/请求地址',{
      HASH,count
    },{
      headers:{
        'Content-Type':'application/x-www-form-urlencoder'
      }
    })
    if(data.code===0){
      alert(`上传成功,地址为${data.servicePath}`)
      return
    }
    // 显示上传成功的名字
    throw data.codeText
  }catch (e) {
    alert(`上传失败`)
  }
}