Question

因此，出于某些原因，我需要使用FORM在输入中POST base64编码图像。图像大小~1.1MB，大小2500x1700。 Base64编码大小~1.5MB。

所以我在表单中有两个输入：输入文件和输入隐藏。下载图像后输入隐藏（使用FileReader将图像转换为base64），我清除输入文件值，因此，没有额外的文件。

当我尝试提交表单页冻结并且内存消耗从50％增加到93％（4Gb RAM）然后Chrome崩溃。

当我尝试在Firefox中运行此页面时（总是缓慢且滞后），我发布了即时消息，没有额外的内存消耗。

当然，我会将此帖发布到Chrome问题，但现在我需要知道：有什么技巧可以避免吗？好吧，也许我不是第一个发现这个错误的人。

好的，如果在FileReader的onload事件中使用 input.value = e.target.result ，我会收到内存泄漏。如果我将等长自定义文本设置为input.value，则没有问题。所以，我不认为e.target.result可以保存对FileReader的引用（或者它可以？），因为它是字符串。因此，我们在接收FileReader结果时遇到本机chrome问题。

input.addEventListener("change", function() {
  var reader = new FileReader();
  reader.onload = function(e) {
    document.getElementById("input_hidden").value = e.target.result;
  };
  reader.readAsDataURL(this.files[0]);
});

Answer 1

尝试使用隐身<textarea>代替input hidden。

看起来像是：

<textarea style="display:none" id="XXX">
$("XXX").value = base64

还要确保完全删除input file，将其保留在表单标记之外，然后将其从DOM中删除。

希望这有帮助

使用带有base64编码图像的POST的Chrome内存泄漏 - 如何解决？

1 个答案: