Vue实现Base64转png、jpg

method中写两个方法：

• 1. 根据base64转图片的方法
• 2. 根据转换出blob格式的文件导出的方法

//base64转png
    base64ImgtoFile(dataurl, filename = 'file') {
      const arr = dataurl.split(',')
      const mime = arr[0].match(/:(.*?);/)[1]
      const suffix = mime.split('/')[1]
      const bstr = atob(arr[1])
      let n = bstr.length
      const u8arr = new Uint8Array(n)
      while (n--) {
        u8arr[n] = bstr.charCodeAt(n)
      }
      return new File([u8arr], `${filename}.${suffix}`, {
        type: mime
      })
    },
    //图片下载
    downloadBlob(blob, filename) {
      const url = URL.createObjectURL(blob);
      const a = document.createElement('a');
      a.href = url;
      a.download = filename;
      a.click();
      URL.revokeObjectURL(url);
    }

传入base64的图片全路径，在合适的位置分别调用这两个方法，即可实现下载

    var base64Img = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAABAFJREFU
..........................DlzUWu L9NALAI4D JOIkszc5PuWNABcBbAbwGGt9ewmAFLKJ5n5s5iXEhZCvBQEgQ3YEdd1p4UQR9PpdH11dXWRmV8motPJZPJgIpH4bWVl5dDw8PAR3/ftE2B9BuzX6Ojo/kajYZvp/i5vhAYRXbBPs3YTdcuYlPIuZj7tOM4r2 n vx6nPdR/x1T/Aau20TA//wiSAAAAAElFTkSuQmCC';
    var imgFile = this.base64ImgtoFile(base64Img);
    this.downloadBlob(imgFile, 'test.png')

这篇好文章是转载于：学新通技术网