首頁猿問將blob轉換為base64

將blob轉換為base64

JavaScript JQuery

小唯快跑啊 2019-08-27 11:12:08

將blob轉換為base64這是我要Blob對Base64字符串執(zhí)行的代碼的代碼段：這個注釋部分有效，當由此生成的URL設置為img src時，它會顯示圖像：var blob = items[i].getAsFile();//var URLObj = window.URL || window.webkitURL;//var source = URLObj.createObjectURL(blob);//console.log("image source=" + source);var reader = new FileReader();reader.onload = function(event){console.log(event.target.result)}; // data url!var source = reader.readAsBinaryString(blob);問題是代碼越低，生成的源變量為null更新：有沒有更簡單的方法來使用JQuery從Blob文件創(chuàng)建Base64字符串，如上面的代碼？

查看完整描述

3 回答

慕勒3428872

TA貢獻1848條經(jīng)驗獲得超6個贊

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

將文檔 readAsDataURL編碼形式為base64

反對回復 2019-08-27

動漫人物

TA貢獻1815條經(jīng)驗獲得超10個贊

這對我有用：

var blobToBase64 = function(blob, callback) {
    var reader = new FileReader();
    reader.onload = function() {
        var dataUrl = reader.result;
        var base64 = dataUrl.split(',')[1];
        callback(base64);
    };
    reader.readAsDataURL(blob);};

反對回復 2019-08-27

桃花長相依

TA貢獻1860條經(jīng)驗獲得超8個贊

所以問題是你想要上傳一個基礎64圖像，你有一個blob網(wǎng)址?，F(xiàn)在，適用于所有html 5瀏覽器的答案是：執(zhí)行：

  var fileInput = document.getElementById('myFileInputTag');
  var preview = document.getElementById('myImgTag');

  fileInput.addEventListener('change', function (e) {
      var url = URL.createObjectURL(e.target.files[0]);
      preview.setAttribute('src', url);
  });function Upload(){
     // preview can be image object or image element
     var myCanvas = document.getElementById('MyCanvas');
     var ctx = myCanvas.getContext('2d');
     ctx.drawImage(preview, 0,0);
     var base64Str = myCanvas.toDataURL();
     $.ajax({
         url: '/PathToServer',
         method: 'POST',
         data: {
             imageString: base64Str         },
     success: function(data) { if(data && data.Success) {}},
     error: function(a,b,c){alert(c);}
     });
 }

反對回復 2019-08-27