做网站 做app好,什么是网站死链,多城市分站网站建设,网站域名ip查询前端获取文件的md5值#xff0c;与文件一同传到后端#xff0c;后端同样对md5值进行校验。如果相同#xff0c;则文件未被损坏#xff08;其实这种方式优点类似于tcp、ip的差错校验#xff0c;好像token也是这种方式#xff09;
项目准备
前端并不可能手写一个算法来实…前端获取文件的md5值与文件一同传到后端后端同样对md5值进行校验。如果相同则文件未被损坏其实这种方式优点类似于tcp、ip的差错校验好像token也是这种方式
项目准备
前端并不可能手写一个算法来实现校验于是在gitHub上找到一个spark-md5的js插件 SparkMD5库 library:https://github.com/satazor/SparkMD5
npm i spark-md5 -save代码处理
在处理过程中需要注意的是file.onload是一个异步事件因此使用时需要使用promise封装一下才能得到异步的返回值 然后在后面处理ajax请求
export default function (file) {return newPromise(resolve, reject){//声明必要的变量let fileReader new FileReader()//文件分割方法注意兼容性blobSlice File.prototype.mozSlice || File.prototype.webkitSlice || File.prototype.slice,//文件每块分割2M计算分割详情chunkSize 2097152,chunks Math.ceil(file.size / chunkSize),currentChunk 0,//每块文件读取完毕之后的处理fileReader.onload function (e) {console.log(读取文件, currentChunk 1, /, chunks);//每块交由sparkMD5进行计算spark.appendBinary(e.target.result);currentChunk;//如果文件处理完成计算MD5如果还有分片继续处理if (currentChunk chunks) {loadNext();} else {console.log(finished loading);console.info(计算的Hash, spark.end());}//处理单片文件的上传function loadNext() {var start currentChunk * chunkSize,end start chunkSize file.size ? file.size : start chunkSize;fileReader.readAsBinaryString(blobSlice.call(file, start, end));}loadNext();}}
}如果是前端生成文件流则
let blob new Blob([text],type:application/octet-stream)
//blob 转arraybuffer类型 另一篇文章
let md5 SparkMD5.ArrayBuffer.hash(arraybuffer).toString().toUpperCase();spark-md5 的详解博客推荐 https://blog.csdn.net/qq_36017964/article/details/131247303
