Question

我试图在stackoverflow上找到这个解决方案但没有成功。我想从我的json文件中获取带有图像URL的Base64。例如：

result({"image":"https://www.google.co.uk/images/branding/googlelogo/2x/googlelogo_color_120x44dp.png"});

是否有任何建议如何使用Javascript或jQuery从中获取Base64 DataURI并避免CORS错误？

非常感谢提前。

Answer 1

正确的解决方案是：

getBase64FromUrl("http://upload.wikimedia.org/wikipedia/commons/4/4a/Logo_2013_Google.png");
function getBase64FromUrl(url) {
var img = new Image();
img.setAttribute('crossOrigin', 'anonymous');
img.onload = function () {
    var canvas = document.createElement("canvas");
    canvas.width =this.width;
    canvas.height =this.height;
    var ctx = canvas.getContext("2d");
    ctx.drawImage(this, 0, 0);
    var dataURL = canvas.toDataURL("image/png");
    var url= dataURL.replace(/^data:image\/(png|jpg);base64,/, "");
};
img.src = url;
}

确保您从中获取图像的服务器已将此标头设置为Access-Control-Allow-Origin“*”

从带有图像URL的json到Base64（日期uri）

1 个答案: