1. ホーム
  2. ジャバスクリプト

[解決済み】BLOBをBase64に変換する

2022-04-07 01:05:56

質問

これは、私がやりたいコードのスニペットです。 Blob から Base64 の文字列を表示します。

このコメント部分が動作し、これによって生成された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であることです。

更新してください。

上記のコードのように、BlobファイルからBase64文字列を作成できるように、JQueryでこれを行う簡単な方法はありますか?

解決方法は?

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

を形成します。 ドキュメント readAsDataURL base64にエンコードする

として await できる機能です。

function blobToBase64(blob) {
  return new Promise((resolve, _) => {
    const reader = new FileReader();
    reader.onloadend = () => resolve(reader.result);
    reader.readAsDataURL(blob);
  });
}

注:Base64エンコードされたデータの前にあるData-URL宣言を最初に削除しないと、Blobの結果を直接Base64としてデコードすることはできません。Base64エンコードされた文字列のみを取得するには、まずdataを削除してください。 / ;base64、結果から。