bash.org:

Следуй за мной:

twiby

Адовый чад кутежа и трэш в комплекте

Как получить base64 картинки в javascript

Пришло на ум: 5 декабря 2012


Base64 - довольно полезная в некоторых ситуациях штука, которая обычно используется когда надо представить бинарные данные в текстовом виде для хранение или переноса. Так, например, если вы хотите сделать одиночный html файл с картинками, вполне можно использовать base64 в src картинки.

Вот как, например, эта картинка (inspect element):

base64 example

Как получить base64 img картинки в javascript:

function getBase64Image(img) {
    // создаем канвас элемент
    var canvas = document.createElement("canvas");
    canvas.width = img.width;
    canvas.height = img.height;

    // Копируем изображение на канвас
    var ctx = canvas.getContext("2d");
    ctx.drawImage(img, 0, 0);

    // Получаем data-URL отформатированную строку
    // Firefox поддерживает PNG и JPEG. 
    var dataURL = canvas.toDataURL("image/png");

    return dataURL.replace(/^data:image\/(png|jpg);base64,/, "");
}

function getBase64ImageById(id){
   return getBase64Image(document.getElementById(id));
}

Если мой пост помог вам сэкономить пару часов времени или показался полезным, думаю не лишним будет показать его друзьям через социальные сети или упомянуть в своем блоге.


Ваше мнение:

Имя

;' : 2014-04-14 06:32:31

kk,

hi : 2014-04-14 06:32:55

hmmm hmmm :)
   другие статьи с тегом JavaScript

Случайная мысль:

Я не понимаю, к чему заниматься злословием. Если хочешь насолить кому-либо, достаточно лишь сказать о нем какую-нибудь правду
Фридрих Ницше
drcreazy © 2008-2012 all rights reserved