Async blobToString(blob){return new Promise(resolve=>{const reader = new FileReader() reader.onload = function(){ console.log(reader.result) const ret = reader.result.split('') .map(v=>v.charCodeAt()) .map(v=>v.toString(16).toUpperCase()) // .map(v=>v.padStart(2,'0')) .join('') resolve(ret) // const ret = reader. } Reader. ReadAsBinaryString (blob)})}, / / determine whether GIF async isGif (file) {/ / GIF89a and GIF87a/front / 6 hexadecimal, '47 49 46 38 39 61' '47 49 46 38 37 61' // hex conversion const ret = await this.blobToString(file.slice(0,6)) const isGif = (ret=='47 49 46 38 39 61') || (ret=='47 49 46 38 37 61') return isGif }, Async isPng(file){const ret = await this.blobtostring (file.slice(0,8)) const isPng = (ret == "89 50 4E 47 0D 0A 1A 0A")  return ispng }, Async isJpg(file){const len = file.size const start = await this.blobToString(file.slice(0,2)) const tail = await this.blobToString(file.slice(-2,len)) const isjpg = (start=='FF D8') && (tail=='FF D9') return isjpg }, Async isImage (file) {return await this. IsGif (file) | | await this. IsPng (file)}, / / file section of the file. The slice (1000200); Bytes createFileChunk(file,size=CHUNK_SIZE){const chunks = [] let cur = 0 while(cur<this.file.size){ chunks.push({index:cur, file:this.file.slice(cur,cur+size)}) cur+=size } return chunks }, Async calculateHashWorker(){return new Promise(resolve=>{this.worker = new worker ('/hash.js')) this.worker.postMessage({chunks:this.chunks}) this.worker.onmessage = e=>{ const {progress,hash} = e.data this.hashProgress = Number(progress.toFixed(2)) if(hash){ resolve(hash) } } }) }, async uploadChunks(uploadedList=[]){ const requests = this.chunks.filter(chunk=>uploadedList.indexOf(chunk.name)==-1) .map((chunk,index)=>{// convert to promise const form = new FormData() form.append('chunk',chunk.chunk) form.append('hash',chunk.hash) form.append('name',chunk.name) // form.append('index',chunk.index) return {form, index:chunk.index,error:0} }) .map(({form,index})=> this.$http.post('/uploadfile',form,{ onUploadProgress:progress=>{ // Instead of an overall progress bar, each block has its own progress bar, The overall progress bar need to compute this. Chunks [index]. Progress = Number (((progress. The loaded/progress. Total) * 100). The toFixed (2))}}))Copy the code

Through the blob. slice method, large files can be fragmented, and each file fragment can be submitted to the background in a round-robin manner to realize file fragment uploading.