SparkMD5获取不同图片的md5显示相同,解决办法

按道理来说,不同的图片应该具有不同的md5,但是在测试的时候发现上传不同的图片md5总是一样的。
在这里插入图片描述
看看代码:

    handleFileChange(file) {
      console.log(file) // 变化的文件对象
      const reader = new FileReader()
      reader.readAsDataURL(file.raw)
      var Spark = new SparkMD5.ArrayBuffer()
      const that = this
      reader.onload = function(event) {
        const img_base64 = event.target.result
        console.log(img_base64)
        that.basic_config_info.logo_stream = img_base64
        Spark.append(event.target.result)
        var md5 = Spark.end()
        console.log('md5')
        console.log(md5)
        if (that.basic_config_info.logo_md5 === md5) {
          console.log('相等')
        } else {
          console.log('不相等')
        }
        that.basic_config_info.logo_md5 = md5
      }
    },

在这里插入图片描述
我既要获取到图片的base64也要获取到md5,而reader.readAsDataURL(file.raw)用来获取base64,如果用来获取md5,就会出现相同的md5,正确获取md5应该使用reader.readAsArrayBuffer(file.raw)
所以应该设置两个不同的reader来分别获取base64和md5
下面是正确的代码:

    handleFileChange(file) {
      console.log(file) // 变化的文件对象
      const stream_reader = new FileReader()
      const md5_reader = new FileReader()
      stream_reader.readAsDataURL(file.raw)
      md5_reader.readAsArrayBuffer(file.raw)
      const that = this
      stream_reader.onload = function(event) {
        const img_base64 = event.target.result
        console.log(img_base64)
        that.basic_config_info.logo_stream = img_base64
      }
      md5_reader.onload = function(event) {
        var Spark = new SparkMD5.ArrayBuffer()
        Spark.append(event.target.result)
        var md5 = Spark.end()
        console.log('md5')
        console.log(md5)
        that.basic_config_info.logo_md5 = md5
      }
    },

然后上传不同的图片,就会发现具有不同的md5啦!
在这里插入图片描述

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值