blob切片上传

<input type="file" id="file">
<script>
  //  blob类型把文件切成多个文件，二进制类型。
  //  blob协议 具有上传到后端之前先把内容展示到页面的能力
  document.getElementById('file').addEventListener('change',(event) => {
    const file = event.target.files[0]
    console.log(file.slice(0,102400))
    console.log(Object.prototype.toString.call(file.slice(0,102400))) //  [object Blob]
    /**
     * 通过bolb协议在图片未上传到服务器的时候直接显示出来
     */
    const URL = window.URL;
    const blobUrl = URL.createObjectURL(file)
    //  blob协议创建出来的地址可以直接访问
    document.body.appendChild(
      document.createElement('img')
    ).src =  blobUrl
    console.log(blobUrl);
    //  释放对象  为了提升性能和减少内存状态
    window.onload = function () {
      URL.revokeObjectURL(blobUrl)
    }
    /**
     *    切片
     */
    let cur = 0;
    let size = 1024 * 1024; //  1m
    //  blob 数组存放多个切片
    const fileChunkList = []
    //  
    while(cur < file.size){
      fileChunkList.push({
        file:file.slice(cur , cur + size)
      })
      cur += size
    }
  })
</script>