Получение данных BLOB из запроса XHR

var xhr = new XMLHttpRequest();
xhr.open('GET', 'http://static.reddit.com/reddit.com.header.png', true);

xhr.responseType = 'arraybuffer';

xhr.onload = function(e) {
  if (this.status == 200) {
    var uInt8Array = new Uint8Array(this.response);
    var byte3 = uInt8Array[4]; 

    var bb = new WebKitBlobBuilder();
    bb.append(xhr.response);
    var blob = bb.getBlob('image/png'); 
    var base64 = window.btoa(blob);
    alert(base64);

  }
};

xhr.send();

По сути, я пытаюсь получить изображение и преобразовать его в base64.

Из комментариев здесь говорится:

«Конечно. После получения ресурса в виде ArrayBuffer создайте большой двоичный объект из его. Когда он у вас есть, вы может base64 закодировать файл / blob напрямую window.btoa () или FileReader.readAsDataURL () . "

Однако blob это просто [объектный blob] , в то время как мне нужно получить двоичный файл из изображения, чтобы я мог преобразовать его в base64 и отобразить его в теге img с использованием данных.

Кто-нибудь знает, как этого добиться?

Заранее спасибо!

35
задан Marius Mucenicu 25 October 2019 в 05:58
поделиться