加载中...

上传文件时得到文件的md5值(推荐阅读)

1.安装spark MD5

npm i spark MD5

2.vue文件中引入

import SparkMD5 from ''spark-md5''

3.使用

  1. 方法一:
  2. handlePrepareUpload() {
  3. var fileReader = new FileReader();
  4. var dataFile = this.fileList[0];
  5. const _this = this
  6. var spark = new SparkMD5(); //创建md5对象(基于SparkMD5
  7. if (dataFile.size > 1024 * 1024*10) {
  8. var data1 = dataFile.slice(0, 1024 * 1024*10); //将文件进行分块 file.slice(start,length)
  9. fileReader.readAsBinaryString(data1); //将文件读取为二进制码
  10. } else {
  11. fileReader.readAsBinaryString(dataFile);
  12. }
  13. //文件读取完毕之后的处理
  14. //a639e28526d1809745b46bf1189594fe 6d9efe0c593b1383482feb229318e03a
  15. fileReader.onload = function(e) {
  16. spark.appendBinary(e.target.result);
  17. var md5 = spark.end()
  18. console.log(md5)
  19. _this.getMd5Checked(md5)
  20. };
  21. },
  1. 方法二:经测试可用
  2. handlePrepareUpload() {
  3. var file = this.fileList[0]
  4. const fileSize = file.size; // 文件大小
  5. const chunkSize = 1024 * 1024 * 10; // 切片的大小
  6. const chunks = Math.ceil(fileSize / chunkSize); // 获取切片个数
  7. const fileReader = new FileReader();
  8. const spark = new SparkMD5.ArrayBuffer();
  9. const bolbSlice =
  10. File.prototype.slice ||
  11. File.prototype.mozSlice ||
  12. File.prototype.webkitSlice;
  13. let currentChunk = 0;
  14. fileReader.onload = e => {
  15. const res = e.target.result;
  16. spark.append(res);
  17. currentChunk++;
  18. if (currentChunk < chunks) {
  19. loadNext();
  20. console.log(`第${currentChunk}分片解析完成, 开始第${currentChunk +1}分片解析`);
  21. } else {
  22. const md5 = spark.end();
  23. console.log(''解析完成'');
  24. alert(md5)
  25. }
  26. };
  27. const loadNext = () => {
  28. const start = currentChunk * chunkSize;
  29. const end =
  30. start + chunkSize > file.size ? file.size : start + chunkSize;
  31. fileReader.readAsArrayBuffer(bolbSlice.call(file, start, end));
  32. };
  33. loadNext();
  34. },



作者:二营长家的张大炮
链接:https://www.jianshu.com/p/59d076ff88e0
来源:简书
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。