使用JavaScript加载图像库从文件中加载图像，图像大小将增加四倍

使用函数

loadImage（…）

。但是base64字符串大约比通过

FileReader（）

加载它长2-4倍

我已经在处理大文件，所以它们不能太大

var reader = new FileReader();
reader.onload = function() {
    console.log('initial length:', this.result.length);
};
reader.readAsDataURL(image_file);

vs

一些结果：

24839对107482

2498383对5898430

---

2391783 vs.5955498

img.toDataURL（）

需要

img.toDataURL（'image/jpeg）

强制保存为更压缩的jpg而不是png

是的，base64编码会增加大小。你的问题是什么？它们都是用base64编码的，导致两种不同的大小。。。你的问题是为什么它们的尺寸不同？请参见，问题通常带有问号。至于为什么它们不同，从你链接到的页面，库对图像执行某种转换。请注意，您也在调用，这似乎表明

img

是一个

canvas

元素，这也会增加一些开销，默认的图像格式是“image/png”，可能与原始格式不同……感谢查看png就是这样，强制

toDataUrl（'image/jpeg'）

解决了我的文件大小问题。

loadImage(
        file,
        function (img) {
            console.log('resized length:', img.toDataURL().length);
        },
        {
            orientation: true
        }
    );