如何高效地将大文件加载到 IndexedDB 存储中？我的应用程序在超过 100,000 行时崩溃

Question

我有一个特定的 Web 应用程序，它依赖于从客户端的本地文件上传大量数据行。目的是将此数据存储在索引数据库中。

数据只有两列我感兴趣，每列包含一串不超过25个字符的字符，但是最多可以有100万行。

阅读了很多问题和文档，我创建了一些代码，这些代码似乎可以用低于 20,000 行的较小数据集创建 indexeddb，但会破坏较大的数据。

我确定这是由于设计不佳，因为我是这种工作方式的新手，或者可能在 chrome 浏览器中出现某种冻结 - 因为我没有收到任何错误消息，我可以触发一个警报，显示已到达最后一个 for 循环，但是 on.complete 永远不会触发并且数据库似乎永远不会

函数e - 的输入是读取文件。

我还在 for 循环中对数据执行了一个操作，但为了简单起见，我删除了它。

function storeDataEnc (e) {
    var lines = e.target.result.split('\n');
    var request = self.indexedDB.open('DB', 1);
    request.onerror = function(e) {
        console.log("there was and error:" +e.target.errorCode);
    }
    request.onupgradeneeded = function(e){
        var db = request.result;
        var store = db.createObjectStore("col1", {
                    keyPath: "col2"} );
    };

    request.onsuccess = function(e) {

        var db = request.result;
        var tx = db.transaction("dataTable", "readwrite");

        var store = tx.objectStore("dataTable");

        db.onerror = function(e){
            console.log("ERROR" + e.target.errorCode);
        }


    for (var i = 0; i < lines.length; ++i) {
        var test = lines.length - 1;
        if (i == test) {console.log('nearly done')};

            function forEachLinenow (match) {
                if ( match.charAt( 0 ) != '#' ) {
                    match = match.trim();
                    var fields = match.split('\t');
                    var col1in = fields[0];
                    var col2in = fields[3];

                    store.put({ COL1: col1in, COL2: col2in              }
            }
        forEachLinenow(lines[i] + '\n');
    }
    tx.oncomplete = function() {
            db.close();
            alert("all data read");
        }
    }
}

我猜我不明白浏览器在阻止恶意应用程序占用过多资源方面存在一些问题。有没有人用过这么大的数据，谁能发现我过程中的错误。

我猜我可能需要生成不止一笔交易，我确实尝试过，但似乎并没有改变我的问题。

我知道这可能会很慢，但是只要数据成功导入，速度本身并不是最大的问题。

Answer 1

您可能达到了浏览器的数据大小限制。

在 mozilla 文档中它提到了限制 https://developer.mozilla.org/en-US/docs/Web/API/IndexedDB_API/Browser_storage_limits_and_eviction_criteria

这里是 indexeddb 的一些更多限制，这些限制由记录的 google 用于流行的浏览器。 https://developers.google.com/web/fundamentals/instant-and-offline/web-storage/offline-for-pwa

似乎限制都是基于 host os 的可用存储空间。检查您希望导入的数据的大小和您的可用存储空间。

如何高效地将大文件加载到 IndexedDB 存储中？我的应用程序在超过 100,000 行时崩溃

How to efficiently load large files into IndexedDB storage? My app is crashing at over 100,000 rows

javascript

large-data

indexeddb