html5 canvas compression的dataurl()输出的大小大于原始值[重复]

因此,我已经与这个实现紧密地实现了: Use HTML5 to resize an image before upload .

我有以下压缩机图:

compressedImageURL = canvas.toDataURL('image/jpeg', 0.8)

除了压缩它,我需要发送服务器,而不是base64,而是jpeg格式。

我做了这个函数:

            const byteString = atob(compressedImageURL .split(',')[1])
            const mimeString = compressedImageURL .split(',')[0].split(':')[1].split(';')[0]
            const ab = new ArrayBuffer(byteString.length)
            const ia = new Uint8Array(ab)
            for (let i = 0; i < byteString.length; i++) {
                ia[i] = byteString.charCodeAt(i)
            }
            // construct the file object
            const bb = new Blob([ia], { type: mimeString })

我用2MB文件检查过图像,压缩似乎完成了它的工作(当我 console.log(bb.size) 我看到尺寸减小了)。

但是,当我上传一个10MB的图像时,我看到它已经增加到19MB。

根据我的理解,base64实际上增加了原始大小的30%,但是我想增加压缩比(在本例中 0.8 )会阻止它。

是否有一定的门槛 dataURL 压缩图像有限制吗?