Question

我正在尝试使用 kartik @的html5文件输入功能来上传大量图片。我希望最终用户在上传之前不必调整图像大小，所以我使用 resizeImage选项 @。上传大文件时遇到问题（每个3-4MB）。

我修改了fileinput.js以使用调整大小的blob替换预览图像，但是我的浏览器（Chrome 48.0.2564.103 m）仍然列出F12中的原始（大文件大小）blob - ＆gt;资源 - ＆gt; ... - ＆gt;图像文件夹。上传数百张图片时，浏览器最终会耗尽内存并崩溃。

我无法在fileinput.js的'self'对象中找到对原始/大blob的任何引用，所以我不知道如何收集这个未使用的blob垃圾。

jsfiddle of issue / link to modified fileinput.js（修改时间：2396-2412）

                   setTimeout(function(d) {
                    console.log('attempting to replace original blob with:');
                    console.log(blob);
                    console.log(objUrl.createObjectURL(blob));
                    console.log('attempting to revoke original blob: ' + image.src);
                    objUrl.revokeObjectURL(image.src);
                    delete image.src;
                    self.clearDefaultPreview();
                    image.src = objUrl.createObjectURL(blob);
                    console.log('outputting fileinput.js self var:');
                    console.dir(JSON.stringify(self));
                    console.dir(self);

                }, 500);
            }, type, self.resizeQuality);

            console.log('current image.src blob is: ' + image.src);

@I没有发布两个以上链接的声誉，所以我在jsfiddle的javascript框架中嵌入了插件文档的链接。

非常感谢任何帮助。

Answer 1

我弄清楚发生了什么，fileinput脚本没有调整blob的大小，直到所有图像都被预加载。在修改它以一次处理一个图像之后，我的表现与大图像一样可以预期 - 谢谢你们的评论。

blob垃圾收集问题

1 个答案: