在javascript中Blob到Base64

时间:2018-04-26 15:41:51

标签: javascript angularjs base64 ionic3 blob

我已成功将base64(DATA_URI)图像转换为blob但无法将其还原。

我的base64到blob代码如下所示,有关详细信息,请查看此link

b64toBlob(b64Data, contentType, sliceSize) {
    contentType = contentType || '';
    sliceSize = sliceSize || 512;

    var byteCharacters = atob(b64Data);
    var byteArrays = [];

    for (var offset = 0; offset < byteCharacters.length; offset += sliceSize) {
        var slice = byteCharacters.slice(offset, offset + sliceSize);

        var byteNumbers = new Array(slice.length);
        for (var i = 0; i < slice.length; i++) {
            byteNumbers[i] = slice.charCodeAt(i);
        }

        var byteArray = new Uint8Array(byteNumbers);

        byteArrays.push(byteArray);
    }

    var blob = new Blob(byteArrays, {type: contentType});
    return blob;
}

我正在尝试将我的blob转换为base64我收到错误

  

错误类型错误:无法在“FileReader”上执行“readAsDataURL”:参数1的类型不是“Blob”。

这是我回复我的blob图像res link

的回复

我正在调用成功回调但不能忍受这个

这是我尝试将blob转换为base64的代码

if(window.FileReader) {
          var reader = new FileReader();
          reader.readAsDataURL(blob); 
          reader.onloadend = () => {
              var base64data = reader.result;                
              console.log(base64data);
          }
        }

调试时我无法看到reader.onloadend它为空,我无法调用它。

任何帮助??

1 个答案:

答案 0 :(得分:2)

我认为在开始阅读数据之前需要定义onloadend。在您分配之前,可能会完成读取和触发空函数。或者更确切地说,当您致电readAsDataURL时,onloadendnull

var reader = new FileReader();
reader.onloadend = () => {
  var base64data = reader.result;                
      console.log(base64data);
}

reader.readAsDataURL(blob);