自用记录:
//压缩方法
dealImage(base64, w, callback) {
let newImage = new Image()
let quality = 0.8 // 压缩系数0-1之间
newImage.src = base64
newImage.setAttribute(‘crossOrigin’, ‘Anonymous’) // url为外域时需要
let imgWidth, imgHeight
newImage.onload = function () {
imgWidth = this.width
imgHeight = this.height
let canvas = document.createElement(‘canvas’)
let ctx = canvas.getContext(‘2d’)
if (Math.max(imgWidth, imgHeight) > w) {
if (imgWidth > imgHeight) {
canvas.width = w
canvas.height = (w * imgHeight) / imgWidth
} else {
canvas.height = w
canvas.width = (w * imgWidth) / imgHeight
}
} else {
canvas.width = imgWidth
canvas.height = imgHeight
quality = 0.8
}
ctx.clearRect(0, 0, canvas.width, canvas.height)
ctx.drawImage(this, 0, 0, canvas.width, canvas.height)
let base64 = canvas.toDataURL(‘image/jpeg’, quality) // 压缩语句
callback(base64) // 必须通过回调函数返回,否则无法及时拿到该值
}
},
//然后调用压缩方法 第一个参数就是原来的字符串,第二个是宽度,第三个就是回调方法,也就是压缩函数最后面那个callback(base64)
dealImage(base64, 500, useImg);