Загрузка и преобразование изображения в base64 приводит к повреждению данных

Question

Я пытаюсь загрузить изображение с помощью got и преобразовать его в строку в кодировке base64 с использованием интерфейса буфера как responsetype. Мой текущий фрагмент преобразовывает изображение и записывает закодированную строку в консоль:

'use strict';

const got = require('got');
const imgUrl = 'https://www.google.de/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png'


got(imgUrl, {
    responseType: 'buffer'
})
.then(response => Buffer.from(response.body, 'binary').toString('base64'))
.then(console.log)

Я записал строку в кодировке base64 в файл, перенаправив любой вывод терминала в файл следующим образом:

node base64.js >> base64_image

Я открыл файл и скопировал его содержимое в онлайн-средство просмотра изображений base64 , которое показывает поврежденный символ изображения вместо желаемого изображения.

Мой подход к загрузке и кодированию неверен или я что-то упустил? Как я мог сузить проблему, чтобы исправить эту ошибку?

Answer 1

Нет responseType свойства. Вы должны использовать свойство encoding, по умолчанию utf8

got(imgUrl, {
    encoding: null
})
.then(response => response.body.toString('base64'))
.then(console.log)

Или напрямую: encoding: 'base64'

got(imgUrl, {
        encoding: 'base64'
    })
    .then(response => response.body)
    .then(console.log)

В противном случае вы пытаетесь преобразовать обратно из utf8 закодированного изображения, поэтому оно повреждено. Вы не можете преобразовать изображение в utf8, а затем преобразовать его обратно.

Answer 2

Ради полноты и для людей, натыкающихся на мой вопрос в будущем, позвольте мне обобщить мой окончательный подход, основанный на принятом ответе и предварительно ожидающий требуемый data:image/png;base64:

'use strict';

const got = require('got');

const imgUrl = 'https://www.google.de/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png'


got(imgUrl, {
    encoding: 'base64'
})
.then(response => {
    const contentType = response.headers["content-type"];
    const imgData = response.body;
    const encodedImage = `data:${contentType};base64,${imgData}`;
    return encodedImage;
})
.then(console.log)