利用canvas 压缩图片大小
compressImage(base64, targSize = 60 * 1024) {
return new Promise((resolve, reject) => {
if (base64.length <= targSize) {
resolve(base64);
return;
}
var newImage = new Image();
newImage.src = base64;
console.log(base64.length);
newImage.setAttribute("crossOrigin", "Anonymous"); //url为外域时需要
newImage.onload = function() {
var quality = 0.95; //压缩系数0-1之间
var canvas = document.createElement("canvas");
var ctx = canvas.getContext("2d");
ctx.clearRect(0, 0, canvas.width, canvas.height);
ctx.drawImage(this, 0, 0, canvas.width, canvas.height);
var base64 = canvas.toDataURL("image/png", quality); //压缩语句
// 如想确保图片压缩到自己想要的尺寸,如要求在5-10kb之间,请加以下语句,quality初始值根据情况自定
while (base64.length > targSize) {
quality -= 0.05;
base64 = canvas.toDataURL("image/png", quality);
}
resolve(base64);
};
});
效果: