昨天早上测试了一个Bug,我们上传图片的时候需要裁剪,他本地上传的是572kb的图片大小,我之前已经做了限制,超过1M的图片会提示限制。但是这次竟然会有提示。我一下子蒙圈了,最后定位到这个方法,this.cropper1.getCroppedCanvas().toDataURL(),如果给toDataURL()添加参数“image/jpeg”,就正确了。
查了一下官网,如下所述:
已知图像尺寸增加:使用该HTMLCanvasElement.toDataURL
方法在浏览器端导出裁剪后的图像时,导出图像的尺寸可能大于原始图像的尺寸。这是因为导出的图像的类型与原始图像的类型不同。因此,只需将原始图像的类型作为第一个参数toDataURL
进行修复即可。例如,如果原始类型是JPEG,则用于cropper.getCroppedCanvas().toDataURL('image/jpeg')
导出图像。