vue 根据图片地址 转换base64字符串
getBase64(imgUrl, callback) { // 一定要设置为let,不然图片不显示 const image = new Image(); // 解决跨域问题 image.setAttribute("crossOrigin", "anonymous"); const imageUrl = imgUrl; image.src = imageUrl; // image.onload为异步加载 // eslint-disable-next-line no-undef image.onload = function() { var canvas = document.createElement("canvas"); canvas.width = image.width; canvas.height = image.height; var context = canvas.getContext("2d"); // eslint-disable-next-line no-undef context.drawImage(image, 0, 0, image.width, image.height); var quality = 0.8; // 这里的dataurl就是base64类型 // 使用toDataUrl将图片转换成jpeg的格式,不要把图片压缩成png,因为压缩成png后base64的字符串可能比不转换前的长! const dataurl = canvas.toDataURL("image/jpeg", quality); callback ? callback(dataurl) : null; //调用回调函数 }; }
调用 baseImg为图片地址
this.getBase64(baseImg, dataURL => { console.log(dataURL ); });
上一篇:
通过多线程提高代码的执行效率例子
下一篇:
自定义注解日志耗时统计