前端vue上传时获取文件的md5哈希值
项目有一个新的需求,上传文件之前先获取文件hash值传给后端进行校验,看看文件是否已经上传识别过,避免重复上传识别资源浪费..前端采用的vue3+vite.以下是实现方式.(vue2应该同样适用)
使用spark-md5组件
npm install spark-md5 --save
引入组件使用
import SparkMD5 from "spark-md5";
使用组件进行计算哈希值
//以下获取文件哈希值方法
var fileReader = new FileReader();
var spark = new SparkMD5.ArrayBuffer();
// 获取文件二进制数据
fileReader.readAsArrayBuffer(file);
fileReader.onload =(e: any)=>{
spark.append(e.target.result);
var fileHash = spark.end();
console.log(fileHash,"文件哈希值");
};
//
页面上传中的代码,我是用的element的上传组件的方法