Как получить данные изображения из атрибута src?

Question

Привет Я пытаюсь получить данные изображения из тега img с помощью jquery.

var imagedata = $('.avatar_store img').attr('src'); 

Я получаю неопределенный как возвращение к этой imagedata.How читать этот образ как сгусток в base64 format.Can вы помочь мне? Заранее спасибо.

Answer 1

HTML

<img id=imageid src=https://www.google.de/images/srpr/logo11w.png> 

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); 
    var dataURL = canvas.toDataURL("image/png"); 
    return dataURL.replace(/^data:image\/(png|jpg);base64,/, ""); 
} 

var base64 = getBase64Image(document.getElementById("imageid")); 

Источник

CONVERT Image url to Base64

Answer 2

Вы можете получить данные изображения с помощью холст:

var img = new Image(); 
img.crossOrigin = 'Anonymous'; 
img.onload = function() { 
    var canvas = document.createElement('canvas'), 
     ctx = canvas.getContext('2d'), 
     dataURL; 

    canvas.height = this.height; 
    canvas.width = this.width; 
    ctx.drawImage(this, 0, 0); 

    dataURL = canvas.toDataURL(outputFormat); 
    console.log('base64', dataURL); 

    canvas.toBlob(function(blob) { 
     console.log('blob', blob); 
    }); 
}; 
img.src = $('.avatar_store img').attr('src');