Метка: base64

JavaScript: декодирование строки в Base64

WEB

Вообще штатно есть функции для кодирования/декодирования: atob / btoa. Но один нюанс: если строчку вида «Hello world!» они кодирую-декодируют легко, то с бинарными файлами выйдет ой. Не, они конечно тоже что-то сделают, но с «тихой ошибкой» — т.е. результат будет, но не верен. Попался так, когда с сервера передавал файл в base64 на клиент javascript, декодировал его примерно так:

let a = document.createElement("a");
let file = new Blob([atob(data.result)], {type: 'application/xlsx'});
a.href = URL.createObjectURL(file);
a.download = "template_0.xlsx";
a.click();

А в результате, с виду вроде бы валидный файл, экселем открываться отказался. А всё потому, что atob не работает со строками в Uicode. Потому обычно используют следующие обертки для кодирования-декодирования:

function base64ToBytes(base64) {
  const binString = atob(base64);
  return Uint8Array.from(binString, (m) => m.codePointAt(0));
}
function bytesToBase64(bytes) {
  const binString = String.fromCodePoint(...bytes);
  return btoa(binString);
}
Оставить комментарий , , , , ,

Картинка из base64

WEB

Довольно типичная задача — нужда чтобы изображение полученное в виде данных при помощи например запроса ajax (картинка из base64), отобразилась на веб странице. Решение простое, и даже не требует никаких перекодировок, так как, движёк браузера уже позволяет отображать такие картинки, достаточно указать ему формат данных источника. Например так:

var image = new Image();
image.src = 'data:image/png;base64,iVBORw0K...';
document.body.appendChild(image);
Картинка из base64

Ну а если задачу рассматривать в комплексном виде (картинка из base64), то готовый код с запросом данных для отображения картинки может выглядеть так:

<img id='base64image'>
<script>       
        $.ajax({
            type: 'POST',
            url: '/getdata.php',
            success: function(data){
               document.getElementById('base64image').src = data:image/png;base64,${data.image.content};
            },
            dataType: 'json',
        });
</script>
Оставить комментарий ,

Python 3 получение тела письма в base64

Python

Никогда не было и вдруг опять (с). Тензор изменил формат высылаемых на почту электронных чеков. Ранее было вложение PDF в письме, а тут они решили чек «рисовать» средствами HTML прямо в письме. Ну нам без разницы, будем извлекать его..

Оставить комментарий , , ,