Question

我正在使用WebRTC数据通道来构建文件传输服务。

对于小于30 Mb左右的较小文件，它的效果非常好。现在在接收端，我只是将文件数据保存在内存中，当所有数据都被传输时，我保存文件。

有点像这样：

//On the recieving side
var dataArray = [];
var dcOnMessage= function(event){
    dataArray .push(event.data);
    if(bytesToRecieve == 0)
    {
        var blob = new Blob(dataArray ,{type: incFileDesc.type});
        reader.onload = function (event) {
            saveToDisk(event.target.result,incFileDesc.name);
        }
        reader.readAsDataURL(blob);
    }
}

var saveToDisk = function(fileUrl, fileName) {
        var save = document.createElement('a');
        save.href = fileUrl;
        save.target = '_blank';
        save.download = fileName || fileUrl;
        var event = document.createEvent('Event');
        event.initEvent('click', true, true);

        save.dispatchEvent(event);
        (window.URL || window.webkitURL).revokeObjectURL(save.href);
    }

所以我想将数据保存在磁盘上的文件中，然后直接写入该文件。但是我该怎么做？

Answer 1

由于缺乏将数据附加到blob的方法（请参阅从未在所有浏览器中实现的BlobBuilder API），您目前所做的最好的方法就是这样做。一旦Chrome（如Mozilla已经提供）支持发送blobs over the datachannel，这可能会改变。

filetransfer sample可以很好地处理高达1 GB的文件。

Answer 2

我认为您不能将文件保存在磁盘上（出于安全原因），但您可以将其作为BLOB保存到indexedDB。 IndexedDB现在得到广泛支持（参见http://caniuse.com/#search=indexeddb），适用于本地大型对象存储。有关API的更多详细信息，请参阅https://developer.mozilla.org/en-US/docs/Web/API/IndexedDB_API。以下是在IndexedDB中保存BLOB的示例：https://hacks.mozilla.org/2012/02/storing-images-and-files-in-indexeddb/

Answer 3

我担心目前的标准化API并不容易实现（参见Philipp的回复）。最接近的是将每个保存为localstorage / indexeddb中的blob / etc，然后使用Blob构造函数从blob集合构建最终文件。它仍会有大约2x文件大小的临时内存命中。或者只是抓住内存中的每个blob，直到构建最终的Blob并保存到磁盘（仍然是内存命中，但逐渐增加，直到它构建最终blob时为2倍）。当最终文件的大小达到可用RAM的幅度范围时，这些可能会开始出现问题。

在Firefox中直接传输单个大型Blob-＆gt; Firefox现在使用不推荐的低级别分块机制，无需SCTP ndata支持（目前尚不可用）。它避免了内存命中的2倍部分。

Chrome中有一个非标准的API，可以主要执行追加文档部分，最后我查了一下。这一直是与WebAPI民众讨论的一个领域;可能是时候再次戳他们了。

Webrtc datachannels：在传输大文件期间将数据保存在文件中

3 个答案: