I have a image url which I need to convert to base 64
I am trying with the image onload but I do not get it in base64
var url = "http://upload.wikimedia.org/wikipedia/commons/4/4a/Logo_2013_Google.png";
var image = new Image();
image.onload = function(e) {
console.log("herE", e);
};
image.src = url;
Here is the Demo
did you try using FileReader Api ??
function base64FromUrl(url){ return new Promise(function(resolve, reject) { var xhr = new XMLHttpRequest(); xhr.responseType = 'blob'; xhr.onload = function() { var reader = new FileReader(); reader.onloadend = function () { resolve(reader.result); } reader.readAsDataURL(xhr.response); }; xhr.open('GET', url); xhr.send(); }); } base64FromUrl("http://upload.wikimedia.org/wikipedia/commons/4/4a/Logo_2013_Google.png") .then(function(res) { document.write(res); })
canvas
element HTMLCanvasElement.toDataURL()
, returns a data URI
containing a representation of the image
var url = "http://upload.wikimedia.org/wikipedia/commons/4/4a/Logo_2013_Google.png"; var image = new Image(); image.setAttribute('crossOrigin', 'anonymous'); image.onload = function(e) { var canvas = document.createElement('canvas'); var ctx = canvas.getContext("2d"); canvas.width = this.width; canvas.height = this.height; ctx.drawImage(image, 0, 0, image.width, image.height); console.log(canvas.toDataURL()); }; image.src = url;
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.