Загрузите изображение с помощью Axios и преобразуйте его в base64

Question

Мне нужно загрузить изображение .jpg с удаленного сервера и преобразовать его в формат base64. Я использую axios как мой HTTP-клиент. Я пробовал выдавать git-запрос на сервер и проверял response.data, однако он, похоже, не работает так.

Ссылка на Аксиос: https://github.com/mzabriskie/axios

Ссылка на реализацию base64: https://www.npmjs.com/package/base-64

Я использую NodeJS/React так atob/btoa не работает, Hense библиотеку.

axios.get('http://placehold.it/32').then(response => { 
    console.log(response.data); // Blank 
    console.log(response.data == null); // False 
    console.log(base64.encode(response.data); // Blank 
}).catch(err => console.log(err)); 

Answer 1

Там может быть лучший способ сделать это, но я сделал это так (минус дополнительные биты, как catch() и т.д.):

axios.get(imageUrl, { responseType:"blob" }) 
    .then(function (response) { 

     var reader = new window.FileReader(); 
     reader.readAsDataURL(response.data); 
     reader.onload = function() { 

      var imageDataUrl = reader.result; 
      imageElement.setAttribute("src", imageDataUrl); 

     } 
    }); 

У меня есть подозрение, что по крайней мере часть вашей проблемы может быть серверной. Даже без установки { responseType: "blob" } у вас должно было быть что-то в вашем response.data выход.

Answer 2

Это работало отлично подходит для меня:

function getBase64(url) { 
    return axios 
    .get(url, { 
     responseType: 'arraybuffer' 
    }) 
    .then(response => new Buffer(response.data, 'binary').toString('base64')) 
}