将blob转换为base64

这是我想要Blob到Base64string的代码片段：

这个评论部分的工作原理，当由此生成的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); 

问题在于较低的代码，生成的源variables为空

更新：

有没有更容易的方法来做到这一点与JQuery能够创build从Blob文件Base64string在上面的代码？

Answer 1

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

形成文档 readAsDataURL编码为base64

Answer 2

这对我工作：

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

Answer 3

你可以通过以下方式解决问

 var canvas = $('#canvas'); var b64Text = canvas.toDataURL(); b64Text = b64Text.replace('data:image/png;base64,',''); var base64Data = b64Text; 

我希望这可以帮助你

Answer 4

 var audioURL = window.URL.createObjectURL(blob); audio.src = audioURL; var reader = new window.FileReader(); reader.readAsDataURL(blob); reader.onloadend = function () { base64data = reader.result; console.log(base64data); } 

Answer 5

所以问题是你想要上传一个基本的64位图像，你有一个BLOBurl。 现在可以在所有html 5浏览器上运行的答案是：Do：

  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() { 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);} }); }