网上扒来的,试了一下挺好用的。但是如果试网上的图片,必须试开启跨域的图片,比如腾讯头像之类的,本地图片就可以各种姿势没压力
/**
* 将图片转换为base64
* 解决html2canvas跨域合成失败的问题
*/
getBase64Image('image图片路径', function(url){
// 输出图片的base64,可以直接赋值给img的src
console.log(url)
})
var getBase64Image = function(src, cb) {
var img = document.createElement('img'),
dataURL = '';
img.crossOrigin = '';
img.src = src;
img.onload = () => {
var canvas = document.createElement("canvas");
canvas.width = img.width;
canvas.height = img.height;
var ctx = canvas.getContext("2d");
ctx.drawImage(img, 0, 0, img.width, img.height);
dataURL = canvas.toDataURL();
cb(dataURL);
};
}
网友评论