SOURCE

function getDataUrl(url){
    let image = new Image()
    image.crossOrigin = 'Anonymous'; // 解决Canvas.toDataURL 图片跨域问题
    image.src = url
    image.onload = () => {
        // var body = document.body;
        // var canvas = document.createElement('canvas');
        // body.appendChild(canvas);
        let canvas = document.createElement('canvas')
        canvas.width = image.width;
        canvas.height = image.height;
        canvas.getContext('2d').drawImage(image,0,0)
        let base64Img = canvas.toDataURL('image/jpg')
        console.log('getDataUrl',base64Img);
    }
}
getDataUrl('https://pmbk.zzbank.cn/vueh5/h5img/zz_allinsurance/413209_1.jpg')
var appendCanvas = function() {
	var body = document.body;
	var canvas = document.createElement('canvas');
	body.appendChild(canvas);
	return canvas;
};

var createImage = function(url) {
	var img = new Image();
	img.setAttribute('crossOrigin', 'anonymous');
	img.src = url;
	return img;
};

var imageToBase64 = function(url) {
	var canvas = appendCanvas();
	var context = canvas.getContext('2d');
	var tmpImage = createImage(url);
	var base64Str = '';
	tmpImage.onload = function() {
		canvas.width = tmpImage.width;
		canvas.height = tmpImage.height;
		context.drawImage(tmpImage, 0, 0);
		//base64Str = canvas.toDataUrl('image/png').replace(/^data:image\/(png|jpg);base64,/, '')
		base64Str = canvas.toDataURL('image/png')
        console.log(base64Str);
	};
};
//imageToBase64('https://pmbk.zzbank.cn/vueh5/h5img/zz_allinsurance/413209_1.jpg')
console 命令行工具 X clear

                    
>
console