前端知识:
前端分片上传文件,一般用于大文件的上传。
缺点:基础上传步骤,没有做出异常处理
实现步骤:
上传入口:
<input type="file" id="btnfile" />
<Input type="button" value="上传" onclick="upload(0)"/>
实现方式:
function upload (index) {
let chunkSize = 1024 * 1024; // 大小是1M
let file = btnfile.files[0];
let {fname, fext} = file.name.split("."); // 分割,fname:文件名称,fext:文件后缀名
let start = index * chunkSize;
if (start > file.size){
return; //如果超过了文件的大小,就跳出的递归
}
let blob = file.slice(start, start + chunkSize); // 截取一段
let blobName = `${fname}.${index}.${fext}`;
let blobFile = new File([blob, blobName]);
let formData = new FormData();
formData.append("file", blobFile)
axios.post("",formData)
.then(()=>{
//上传成功
console.log(res);
upload(++index);
}).catch(); // 上传文件
}
记录时间:
2022/4/26