如何将json文件导入indexeddb? [英] How to import json file into indexeddb?

问题描述

我正在做一个将一些数据存储在IndexedDB中的应用程序，但是我想先加载json文件中的一些数据.

I am doing an app that store some data in the IndexedDB, but I want to load first some data that is in my json file.

这是我的json文件:

Here is my json file:

{
  "ciudades":[
    {
      "ciudad":"Asuncion",
      "latitud":-25.2985296,
      "longitud":-57.6710677
    },
    {
      "ciudad":"Caaguazu",
      "latitud":-25.465034,
      "longitud":-56.0183859
    },
    {
      "ciudad":"Ciudad del Este",
      "latitud":-25.4933441,
      "longitud":-54.6710438
    },
     {
      "ciudad":"San Pedro",
      "latitud":-24.1586759,
      "longitud":-56.636503
    },
     {
      "ciudad":"Pedro Juan Caballero",
      "latitud":-22.5450875,
      "longitud":-55.7618963
    }
 ]
}

推荐答案

您按照步骤

步骤1 阅读mozilla网站

第2步创建indexedDB

step 2 create indexedDB

var ciudades = [
{
  "ciudad":"Asuncion",
  "latitud":-25.2985296,
  "longitud":-57.6710677
},
{
  "ciudad":"Caaguazu",
  "latitud":-25.465034,
  "longitud":-56.0183859
},
{
  "ciudad":"Ciudad del Este",
  "latitud":-25.4933441,
  "longitud":-54.6710438
},
 {
  "ciudad":"San Pedro",
  "latitud":-24.1586759,
  "longitud":-56.636503
},
 {
  "ciudad":"Pedro Juan Caballero",
  "latitud":-22.5450875,
  "longitud":-55.7618963
}
];

var IDBSetting = {
    name: "indexedDBName",
    version: 1,
    tables: [{
        tableName: "ciudades",
        keyPath: "seq",
        autoIncrement: true,
        index: ["ciudad", "latitud", "longitud],
        unique: [false, false, false]
    }]
};

! function() {
    console.log("indexeDB init");

    var req = indexedDB.open(IDBSetting.name, IDBSetting.version);

    req.onsuccess = function(event) {
        console.log("indexedDB open success");
    };

    req.onerror = function(event) {
        console.log("indexed DB open fail");
    };

    //callback run init or versionUp
    req.onupgradeneeded = function(event) {
        console.log("init onupgradeneeded indexedDB ");
        var db = event.target.result;

        for (var i in IDBSetting.tables) {
            var OS = db.createObjectStore(IDBSetting.tables[i].tableName, {
                keyPath: IDBSetting.tables[i].keyPath,
                autoIncrement: IDBSetting.tables[i].autoIncrement
            });

            for (var j in IDBSetting.tables[i].index) {
                OS.createIndex(IDBSetting.tables[i].index[j], IDBSetting.tables[i].index[j], {
                    unique: IDBSetting.tables[i].unique[j]
                });
            }
        }
    }
}();

第3步addData

step 3 addData

var IDBFuncSet = {
    //write
    addData: function(table, data) {
        var req = indexedDB.open(IDBSetting.name, IDBSetting.version);

        req.onsuccess = function(event) {
            try {
                console.log("addData indexedDB open success");
                var db = req.result;
                var transaction = db.transaction([table], "readwrite");
                var objectStore = transaction.objectStore(table);
                var objectStoreRequest = objectStore.add(data);
            } catch (e) {
                console.log("addDataFunction table or data null error");
                console.log(e);
            }

            objectStoreRequest.onsuccess = function(event) {
                //console.log("Call data Insert success");
            }
            objectStoreRequest.onerror = function(event) {
                console.log("addData error");
            }
        };

        req.onerror = function(event) {
            console.log("addData indexed DB open fail");
        };
    }
}

for(var i in ciudades){
   IDBFuncSet.addData("ciudades",ciudades[i]);
}

第4步getData

step 4 getData

IDBFuncSet.getAllData = function(arr, table) {
    try {
        var req = indexedDB.open(IDBSetting.name, IDBSetting.version);

        req.onsuccess = function(event) {
            var db = req.result;
            var transaction = db.transaction([table], "readonly");
            var objectStore = transaction.objectStore(table);

            var objectStoreRequest = objectStore.openCursor();

            objectStoreRequest.onsuccess = function(event) {
                var cursor = event.target.result;
                if (cursor) {
                    arr.push(cursor.value);
                    cursor.continue();
                } else {

                }
            }
        };
        req.onerror = function(event) {
            console.log("getAllData indexed DB open fail");
        };
    } catch (e) {
        console.log(e);
    }
}
var ciudadesArr = [];
IDBFuncSet.getAllData(ciudadesArr, "ciudades");

console.log(ciudadesArr);

我希望这对您有帮助

这篇关于如何将json文件导入indexeddb?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！