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

[解決済み】JavaScriptでファイルをbase64に変換する方法は?

2022-03-29 07:05:45

質問

アップデイト TypeScript版もanswerに掲載されています

この行で、Fileオブジェクトを取得するようにしました。

file = document.querySelector('#files > input[type="file"]').files[0]

このファイルをjsonでbase64で送信する必要があります。base64文字列に変換するためにはどうすればよいですか?

どのように解決するのですか?

ES6のモダンな方法 (async/await)

const toBase64 = file => new Promise((resolve, reject) => {
    const reader = new FileReader();
    reader.readAsDataURL(file);
    reader.onload = () => resolve(reader.result);
    reader.onerror = error => reject(error);
});

async function Main() {
   const file = document.querySelector('#myfile').files[0];
   console.log(await toBase64(file));
}

Main();

UPDです。

エラーをキャッチしたい場合

async function Main() {
   const file = document.querySelector('#myfile').files[0];
   const result = await toBase64(file).catch(e => Error(e));
   if(result instanceof Error) {
      console.log('Error: ', result.message);
      return;
   }
   //...
}