Как мне удалось загрузить и преобразовать изображение в URL-адрес Base64? - PullRequest
Новая
       24

Как мне удалось загрузить и преобразовать изображение в URL-адрес Base64?

0 голосов
/ 12 марта 2020

Моя задача заключалась в том, чтобы обрезать изображение и загрузить его в Amazon S3 с различными размерами. Но плагин, который я использовал для обрезки, предоставляет URL-адрес BLOB-объекта вместо строки Base 64. Я попробовал несколько способов конвертировать URL-адрес BLOB-объекта в строку Base64, но у меня возникла эта ошибка javasdcript TypeError: Failed to execute 'readAsDataURL' on 'FileReader': parameter 1 is not of type 'Blob'. Затем я понял, что сначала мне нужно скачать изображение из blob url, тогда только оно будет доступно для конвертации.

Функция 

const getBase64ImageFromUrl =  async(imageUrl) => {
  var res = await fetch(imageUrl);
  var blob = await res.blob();

  return new Promise((resolve, reject) => {
    var reader  = new FileReader();
    reader.addEventListener("load", function () {
        resolve(reader.result);
    }, false);

    reader.onerror = () => {
      return reject(this);
    };
    reader.readAsDataURL(blob);
  })
}

Использование 

const blobUrl = "blob:http://localhost:8000/0bea79ee-878f-49a1-9256-9f1f0be73723"
const base64String = await getBase64ImageFromUrl(blobUrl)
console.log(base64String)
...