Конвертировать файл в формат Base64

Question

Итак, я пытаюсь преобразовать файл из тега. Вот как выглядит мой код javascript:

var file = document.getElementById("file").files[0];
if (file) {
  var filereader = new FileReader();
  filereader.readAsDataURL(file);
  filereader.onload = function (evt) {
    var base64 = evt.target.result;
  }
}

Это возвращает undefined.

Answer 1

два маленьких помощника и пример.

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

const blobToBase64 = blob => blobToDataUrl(blob).then(text => text.slice(text.indexOf(",")));

for(let file of document.getElementById("file").files) {
  blobToBase64(file).then(base64 => console.log(file, base64));
}

Но почему обещания?

Потому что ваш следующий вопрос будет: How do I get the base64 string out of onload?, а краткий ответ You don't. Более длинный ответ будет: It's like asking how to get something from the future into the now. You can't.

Обещания - это заполнитель / оболочка для значений, которые в конечном итоге будут доступны; , но еще не . И они являются основой asyn c функций .

Так что давайте пропустим возиться с обратными вызовами и сразу перейдем к тому моменту, когда вы пишете

for(let file of document.getElementById("file").files) {
  const base64 = await blobToBase64(file);
  console.log(file, base64);
}

, но для что вам нужно будет набрать sh на asyn c и await .

Answer 2

Я думаю, вы пропустили оператор return в коде. Замените вашу функцию следующими строками:

var file = document.getElementById("file").files[0];
if (file) {
  var filereader = new FileReader();
  filereader.readAsDataURL(file);
  filereader.onload = function (evt) {
     var base64 = evt.target.result;
      return base64
  }

}