vue 图片压缩

    baseImg() {
      const at = new Date().getTime()
      const image = new Image()
      image.src = base64String
      const _this = this

      image.onload = () => {
        let resultBlob = ''
        // 压缩图片
        const file = 'image/jpeg'
        resultBlob = _this.compressUpload1(image, file, _this.compressConfig)

        const format = new FormData()
        // format.append('file', blob, Date.now() + '.png')
        // console.log(_this.compressedImg)
        format.append('file', resultBlob, Date.now() + '.jpeg')
        var options = {
          url: '/file/upload',
          method: 'post',
          data: format
        }
        axios(options)
          .then((res) => {
            console.log(res)
            if (res.data.code == 200) {
              const b = Number(new Date().getTime()) - Number(at)
              console.log(b)
            } else {
              _this.$message.error(res.data.message)
            }
          })
          .catch((err) => {
            console.log(err)
          })
      }
    },
    compressUpload1(image, file, compressConfig) {
      // console.log('canvas压缩----')
      // console.log(image)
      // console.log(file)
      // console.log(compressConfig)
      const canvas = document.createElement('canvas')
      const ctx = canvas.getContext('2d')
      let width = compressConfig.width || image.width
      let height = compressConfig.height || image.height

      // 只设置宽度时，等比计算高度
      if (compressConfig.width && !compressConfig.height) {
        height = (compressConfig.width / image.width) * image.height
      }
      // 只设置高度时，等比计算宽度
      if (compressConfig.height && !compressConfig.width) {
        width = (compressConfig.height / image.height) * image.width
      }

      canvas.width = width
      canvas.height = height
      // console.log(canvas)
      ctx.fillRect(0, 0, canvas.width, canvas.height)
      // console.log(canvas)
      ctx.drawImage(image, 0, 0, width, height)

      // console.log(canvas)
      // 进行最小压缩0.1
      // const compressData = canvas.toDataURL(
      //   file || 'image/jpeg',
      //   compressConfig.rate || 0.1
      // )
      const compressData = canvas.toDataURL('image/jpeg', 0.5)
      console.log(compressData)
      this.imageUrl = compressData
      // console.log(compressData)
      // console.log(this.imageUrl)

      // base64转Blob
      const blobImg = this.dataURItoBlob(compressData)
      // console.log(blobImg)
      // 获取压缩后图片的信息
      this.compressedImg = new Image()
      this.compressedImg.src = compressData
      this.compressedImg.height = height
      this.compressedImg.width = width
      this.compressedImg.size = (blobImg.size / 1024 / 1024).toFixed(2)

      // const blob = this.base64ToBlob(this.compressedImg.src)
      // console.log(blob)
      // console.log(this.compressedImg.size )
      // console.log(blobImg)
      return blobImg
    },
 	/* 图片格式转换——base64转Blob对象 */
    dataURItoBlob(data) {
      // console.log(data)
      let byteString
      if (data.split(',')[0].indexOf('base64') >= 0) {
        byteString = data.split(',')[1]
      } else {
        byteString = unescape(data.split(',')[1])
      }
      // console.log(byteString)
      const mimeString = data.split(',')[0].split(':')[1].split(';')[0]
      // console.log(mimeString)
      const ia = new Uint8Array(byteString.length)
      for (let i = 0; i < byteString.length; i += 1) {
        ia[i] = byteString.charCodeAt(i)
      }
      // console.log(ia)
      return new Blob([ia], { type: 'image/jpeg' })
    },