视频上传太大?莫慌切片上传帮助你
首先说说切片方式
方式一 => web-worker
async calculateHash(chunks){
return new Promise(resolve => {
// 防止主线程卡顿
this.container.workder = new Worker("/hash.js");
this.container.workder.postMessage({ chunks });
// 完成计算回调
this.container.workder.onmessage = e => {
const { progress, hash } = e.data;
this.hashProgress = Number(progress.toFixed(2));
if (hash) resolve(hash);
};
})
}
// web-worker
that.importScripts('spark-md5.min.js')
that.onmessage = e => {
// 接受主线程通知 每次一块
const { chunks } = e.data
const spark = new that.SparkMD5.ArrayBuffer()
let progress = 0
let count = 0
const loadNext = index => {
const reader = new FileReader()
reader.readAsArrayBuffer(chunks[index].file)
reader.onload = e => {
// 累加器
count++
// 增量计算md5
spark.append(e.target.Result)
if (count === chunks.length) {
// 通知主线程,计算结束
that.postMessage({
progress: 100,
hash: spark.end()
})
} else {
// 每块结束计算,通知修改进度
progress += 100 / chunks.Length
that.postMessage({
progress
})
// 计算下一块
loadNext(count)
}
}
}
}
// 启动
loadNext(0)
方式二 =>
方式三 => 抽样哈希 未完待续