Pobierz obraz za pomocą Axios i przekonwertuj go na base64

Question

Potrzebuję pobrać obraz .jpg ze zdalnego serwera i przekonwertować go na format base64. Używam axios jako mojego klienta HTTP. Próbowałem już wysłać żądanie git na serwer i sprawdzić response.data, ale wydaje się, że nie działa tak.

Link do Axios: https://github.com/mzabriskie/axios

Link do realizacji base64: https://www.npmjs.com/package/base-64

Używam NodeJS/React tak atob/btoa nie działa, hense bibliotekę.

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

Nie może być lepszy sposób to zrobić, ale zrobiłem to w ten sposób (minus dodatkowe bity jak catch(), etc.):

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); 

     } 
    }); 

Mam podejrzenie, że przynajmniej część twojego problemu może być po stronie serwera. Nawet bez ustawienia { responseType: "blob" } powinieneś mieć coś w swoim wyjściu response.data.

Answer 2

To był świetny dla mnie:

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