IndexedDb 版本更改事务正在运行答案

【问题标题】：IndexedDb version change transaction is runningIndexedDb 版本更改事务正在运行
【发布时间】：2020-04-21 14:14:11
【问题描述】：

我是 JSON 和 indexeddb 的新手。我正在尝试创建一个新表并向其中添加数据，但我总是在 indexdb 的 chrome 控制台中收到此错误。我已经完成了 indexdb 的所有 stackoverflow 内容，但我仍然无法取得进展。如果我更改现有对象存储代码以替换其数据，它可以工作，但是当我尝试添加新对象存储并添加数据时它会失败。这是错误：

未捕获的 DOMException：无法执行“事务” 'IDBDatabase'：版本更改事务正在运行。在填充GHGEF (https://localhost:44364/js/demo/sample.js:437:18) 在 IDBOpenDBRequest.upgradeNeededFunction (https://localhost:44364/js/demo/sample.js:420:17)

它发生在这里：

function populateGHGEF(db, data) {
        var transaction = db.transaction(["gHGEF"], "readwrite");

这是我的代码：

var tacInputsDb = (function setupIndexDb() {
    var DB_NAME = "TacInputsDb";
    var DB_VERSION = "1";
    var db;

    function init(callback) {
        window.indexedDB = window.indexedDB || window.mozIndexedDB || window.webkitIndexedDB ||
            window.msIndexedDB;
        window.IDBTransaction = window.IDBTransaction || window.webkitIDBTransaction ||
            window.msIDBTransaction;

        //always starting fresh...for now.
        //console.log("Deleting current database.");
        //indexedDB.deleteDatabase("InitDB");

        if (!window.indexedDB) {
            window.alert("Your browser doesn't support a stable version of IndexedDB.");
        }

        //console.group("Index DB");

        var openRequest = window.indexedDB.open(DB_NAME, DB_VERSION);

        openRequest.onupgradeneeded = function upgradeNeededFunction(e) {
            //console.log("If upgrade needed");
            var newVersion = e.target.result;


            if (!newVersion.objectStoreNames.contains("GHGEF")) {
                newVersion.createObjectStore("GHGEF", {
                    keyPath: "FuelType"
                    //autoIncrement: true
                }

                );

                var ghgEFdata = [
                    {
                        "FuelType": "Biodiesel",
                        "Energy Density (MJ/unit)": " 126.13 ",
                        "Carbon Intensity \r\n(gCO2/MJ)": " 34.34 ",
                        "Diesel Gallon Equivalent (DGE)": "0.00",
                        "Gasoline Gallon Equivalent (GGE)": "0.00",
                        "Diesel Gallon Equivalent Emission Factor (gCO2e/DGE)": "",
                        "Gasoline Gallon Equivalent Emission Factor (gCO2e/GGE)": "",
                        "EER Values Relative to Diesel": "1.0",
                        "EER Values Relative to Gasoline": " 1.1 "
                    },
                    {
                        "FuelType": "CNG",
                        "Energy Density (MJ/unit)": " 0.98 ",
                        "Carbon Intensity \r\n(gCO2/MJ)": " 79.21 ",
                        "Diesel Gallon Equivalent (DGE)": "0.00",
                        "Gasoline Gallon Equivalent (GGE)": "0.00",
                        "Diesel Gallon Equivalent Emission Factor (gCO2e/DGE)": "",
                        "Gasoline Gallon Equivalent Emission Factor (gCO2e/GGE)": "",
                        "EER Values Relative to Diesel": "0.9",
                        "EER Values Relative to Gasoline": " 1.0 "
                    },
                    {
                        "FuelType": "Diesel",
                        "Energy Density (MJ/unit)": " 134.47 ",
                        "Carbon Intensity \r\n(gCO2/MJ)": " 100.45 ",
                        "Diesel Gallon Equivalent (DGE)": "0.00",
                        "Gasoline Gallon Equivalent (GGE)": "0.00",
                        "Diesel Gallon Equivalent Emission Factor (gCO2e/DGE)": "",
                        "Gasoline Gallon Equivalent Emission Factor (gCO2e/GGE)": "",
                        "EER Values Relative to Diesel": "1.0",
                        "EER Values Relative to Gasoline": " 1.1 "
                    },
                    {
                        "FuelType": "Electric",
                        "Energy Density (MJ/unit)": " 3.60 ",
                        "Carbon Intensity \r\n(gCO2/MJ)": " 81.49 ",
                        "Diesel Gallon Equivalent (DGE)": "0.00",
                        "Gasoline Gallon Equivalent (GGE)": "0.00",
                        "Diesel Gallon Equivalent Emission Factor (gCO2e/DGE)": "",
                        "Gasoline Gallon Equivalent Emission Factor (gCO2e/GGE)": "",
                        "EER Values Relative to Diesel": "5.0",
                        "EER Values Relative to Gasoline": " 3.4 "
                    },
                    {
                        "FuelType": "Gasoline",
                        "Energy Density (MJ/unit)": " 115.83 ",
                        "Carbon Intensity \r\n(gCO2/MJ)": " 99.44 ",
                        "Diesel Gallon Equivalent (DGE)": "0.00",
                        "Gasoline Gallon Equivalent (GGE)": "0.00",
                        "Diesel Gallon Equivalent Emission Factor (gCO2e/DGE)": "",
                        "Gasoline Gallon Equivalent Emission Factor (gCO2e/GGE)": "",
                        "EER Values Relative to Diesel": "1.0",
                        "EER Values Relative to Gasoline": " 1.0 "
                    },
                    {
                        "FuelType": "Hydrogen Fuel Cell",
                        "Energy Density (MJ/unit)": " 120.00 ",
                        "Carbon Intensity \r\n(gCO2/MJ)": " 111.61 ",
                        "Diesel Gallon Equivalent (DGE)": "0.00",
                        "Gasoline Gallon Equivalent (GGE)": "0.00",
                        "Diesel Gallon Equivalent Emission Factor (gCO2e/DGE)": "",
                        "Gasoline Gallon Equivalent Emission Factor (gCO2e/GGE)": "",
                        "EER Values Relative to Diesel": "1.9",
                        "EER Values Relative to Gasoline": " 2.5 "
                    },
                    {
                        "FuelType": "LNG",
                        "Energy Density (MJ/unit)": " 78.83 ",
                        "Carbon Intensity \r\n(gCO2/MJ)": " 97.77 ",
                        "Diesel Gallon Equivalent (DGE)": "0.00",
                        "Gasoline Gallon Equivalent (GGE)": "0.00",
                        "Diesel Gallon Equivalent Emission Factor (gCO2e/DGE)": "",
                        "Gasoline Gallon Equivalent Emission Factor (gCO2e/GGE)": "",
                        "EER Values Relative to Diesel": "0.9",
                        "EER Values Relative to Gasoline": " 1.0 "
                    },
                    {
                        "FuelType": "Renewable Diesel",
                        "Energy Density (MJ/unit)": " 129.65 ",
                        "Carbon Intensity \r\n(gCO2/MJ)": " 30.40 ",
                        "Diesel Gallon Equivalent (DGE)": "0.00",
                        "Gasoline Gallon Equivalent (GGE)": "0.00",
                        "Diesel Gallon Equivalent Emission Factor (gCO2e/DGE)": "",
                        "Gasoline Gallon Equivalent Emission Factor (gCO2e/GGE)": "",
                        "EER Values Relative to Diesel": "1.0",
                        "EER Values Relative to Gasoline": " 1.1 "
                    },
                    {
                        "FuelType": "Renewable Natural Gas",
                        "Energy Density (MJ/unit)": " 0.98 ",
                        "Carbon Intensity \r\n(gCO2/MJ)": " 43.84 ",
                        "Diesel Gallon Equivalent (DGE)": "0.00",
                        "Gasoline Gallon Equivalent (GGE)": "0.00",
                        "Diesel Gallon Equivalent Emission Factor (gCO2e/DGE)": "",
                        "Gasoline Gallon Equivalent Emission Factor (gCO2e/GGE)": "",
                        "EER Values Relative to Diesel": "0.9",
                        "EER Values Relative to Gasoline": " 1.0 "
                    }
                ];
                //populateGHGEF(newVersion);
                populateGHGEF(newVersion, ghgEFdata);
            }
        };

        //openRequest.onerror = openRequest.onblocked = ////console.log("Blocked");
        openRequest.onerror = openRequest.onblocked = function (e) {
            ////console.log("InitDB Blocked.");
        };

        openRequest.onsuccess = function (e) {
            db = e.target.result;
            callback("Tac Inputs Db setup Complete. Database is open.");
        };
    }//END init()

    function populateGHGEF(db, data) {
        var transaction = db.transaction(["gHGEF"], "readwrite");
        console.log("created transaction for ghgef");

        //Do something when all the data is added to the database.
        transaction.oncomplete = function (event) {
            console.log("All done!");
        };

        transaction.onerror = function (event) {
            console.log("Don't forget to handle errors!");
        };

        var objectStore = db.objectStore("gHGEF");
        console.log("accessing object store");

        data.forEach(function (GHGEF) {
            var request = objectStore.add(GHGEF);
            request.onsuccess = function (event) {
                ////console.log("ghgRegion Item Successfully Added.");
            };
        });
    }


        });
    }


    return {
        init: init,

    }
})()

这是我在另一个页面上的调用方式：

(function ($) {
    $(document).ready(function () {
        var p1 = Promise.resolve();
        p1 = p1.then(_ => new Promise(resolve =>
            tacInputsDb.init(function (msg) {
                console.log(msg);
                });
            })
        ));
        });

谁能告诉我我在这里做错了什么。

【问题讨论】：

标签： javascript indexeddb

【解决方案1】：

这个错误的原因在一行

function populateGHGEF(db, data) {
        var transaction = db.transaction(["gHGEF"], "readwrite");

您从 onupgradeneeded 处理程序中调用。

作为快速修复，如果您坚持以这种方式编写代码，您可以等待 versionchange 事务完成，然后通过更改行开始第二个事务

populateGHGEF(newVersion, ghgEFdata);

到

e.target.transaction.oncomplete = function() {
  populateGHGEF(newVersion, ghgEFdata);
};

但是，如果您只是等到适当的时间（即 IDBOpenRequest 成功完成时）才插入数据，则可以完全避免这种情况。这是数据库被认为是打开的时候。

作为一条非正式规则，您不应该在 onupgradeneeded 处理程序中存储数据。该功能仅对程序员可用，因为有时升级数据库需要更改数据的存储方式。但是，如果您不升级数据库（例如更改对象存储），那么您不应该在 onupgradeneeded 中执行插入操作。

改进：

在 onsuccess 处理程序中进行数据更改，那么您不必每次都升级版本来更改数据。
使用 Promise 帮助完全分离调用

【讨论】：

我不得不这样做e.target.transaction.oncomplete = function () { populateGHGEF(newVersion, ghgEFdata); }; 所以你可能想改变你的答案？你能帮我改进这段代码吗？那么你建议我在哪里以及如何调用数据填充方法？我是否应该将调用完全分开为 1. 调用 Db 架构设置 2. 调用数据设置？这是我正在尝试使用的以前开发人员的代码。直到现在都不知道 indexeddb 是什么。