JavaScript 中的文件切片导致空 blob

Question

我正在实现一个基于浏览器的分块文件上传器。要打开文件，我正在使用 <input type="file" id="fileSelector" /> 和这段代码（简化）：

$('#fileSelector').on('change', function () {
    _file = evt.target.files[0];
});

我正在将文件切成块，但没有将块读入内存（未明确）。

问题: 偶尔（对于小于 0.1% 的上传文件）从底层文件切片的块是空的。例如。在上传大文件期间一切顺利，然后在该文件调用的中间：

var _blob = _file.slice(chunk.start, chunk.end, _file.type);

生成空切片（_blob.size 为 0）。将此类 blob 发送到服务器 (.NET 4.6) 会导致 Request.InputStream 为空。我正在发送二进制数据：

_xhr.setRequestHeader('content-type', 'application/octet-stream');
_xhr.send(_blob);

我还应该提到再次调用 _file.slice 会产生相同的空 blob。我可以在 Chrome 57、Chrome 60（Win 和 Mac）、Mac Safari 10.1.1 和 Edge 15 中观察到这一点。其他浏览器也是可能的。

有什么问题吗？我正在考虑的事情：

文件正在使用中
file/disk 已损坏
同时 JavaScript 引擎对 blob 进行了 GC - 如果是这种情况如何确保它没有被 GC？
浏览器错误（我发现了这个，但不确定是否相关：https://bugs.chromium.org/p/chromium/issues/detail?id=167111）

Answer 1

答案很简单：上传的文件消失（重命名、删除）时会发生这种情况。

File slicing in JavaScript results in empty blob