indexedDB 添加记录到 objectStore 只能工作一次
indexedDB add record to objectStore only works once
我试图了解 indexedDB 的工作原理并编写了一个相当基本的站点访问者跟踪器。这是第一次工作。第一次加载页面时,一切都按预期进行。我可以看到数据已添加到我的 objectStore 中。
现在每次刷新页面时,我都没有按预期添加另一条记录。我做错了什么?欢迎任何指导或帮助。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other
head content must come *after* these tags -->
<meta name="description" content="">
<meta name="author" content="">
<script language="JavaScript" src="http://www.geoplugin.net
/javascript.gp" type="text/javascript"></script>
</head>
<body>
// UI here
</body>
<script>
var timeDate = new Date();
var tD=timeDate.toString();
alert(timeDate);
var ip = geoplugin_request(); // get client ip
alert(ip);
var city = geoplugin_city(); // get client city
alert(city);
var country = geoplugin_countryName() ; // get client country
alert(country);
var os = navigator.oscpu; // get platform info
alert(os);
window.indexedDB = window.indexedDB || window.mozIndexedDB ||
window.webkitIndexedDB || window.msIndexedDB;
//prefixes of window.IDB objects
window.IDBTransaction = window.IDBTransaction ||
window.webkitIDBTransaction || window.msIDBTransaction;
window.IDBKeyRange = window.IDBKeyRange || window.webkitIDBKeyRange ||
window.msIDBKeyRange
if (!window.indexedDB) {
window.alert("Your browser doesn't support a stable version of IndexedDB.")
}
var visitorInfo = [{
date : tD,
ip : ip,
city : city,
country: country,
os :os },
];
var db;
var request = window.indexedDB.open("visitor", 1);
request.onerror = function(event) {
console.log("error: ");
};
request.onsuccess = function(event) {
db = request.result;
console.log("success: "+ db);
};
request.onupgradeneeded = function(event) {
var db = event.target.result;
if(!db.objectStoreNames.contains("userinfo")){
console.log("creating userinfo table..");
//var objectStore = db.createObjectStore("userinfo", {keyPath: "ip",autoIncrement:true});
var objectStore = db.createObjectStore("userinfo", {keyPath: "ip"});
}
else{
console.log("userinfo exists");
}
for (var i in visitorInfo) {
objectStore.add(visitorInfo[i]);
}
}
插入对象的代码位于 onupgradeneeded 处理程序中。 onupgradeneeded 处理函数仅在首次创建数据库或增加版本时运行。
另一方面,indexedDB.open 调用的成功处理程序每次都会在创建、升级或刚刚打开数据库时运行。
因此,您想将插入对象的代码从 onupgradeneeded 处理程序移动到成功处理程序中。
我有 运行 访问同样的问题。在我的案例中,有两件事导致了这种情况。
- 如果您已经创建了 table/indexdb,请使用 onsuccess 处理程序。
- 这是愚蠢的部分,但我犯了这个错误。如果您通过浏览器开发人员工具查看数据,当您单击 odjectstore/table 时,indexDB 本身不会更新记录。您必须单击应用程序部分下 indexdb window 上的刷新按钮,以查看记录是否已创建。刷新按钮在数据集的左上角。
我试图了解 indexedDB 的工作原理并编写了一个相当基本的站点访问者跟踪器。这是第一次工作。第一次加载页面时,一切都按预期进行。我可以看到数据已添加到我的 objectStore 中。
现在每次刷新页面时,我都没有按预期添加另一条记录。我做错了什么?欢迎任何指导或帮助。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other
head content must come *after* these tags -->
<meta name="description" content="">
<meta name="author" content="">
<script language="JavaScript" src="http://www.geoplugin.net
/javascript.gp" type="text/javascript"></script>
</head>
<body>
// UI here
</body>
<script>
var timeDate = new Date();
var tD=timeDate.toString();
alert(timeDate);
var ip = geoplugin_request(); // get client ip
alert(ip);
var city = geoplugin_city(); // get client city
alert(city);
var country = geoplugin_countryName() ; // get client country
alert(country);
var os = navigator.oscpu; // get platform info
alert(os);
window.indexedDB = window.indexedDB || window.mozIndexedDB ||
window.webkitIndexedDB || window.msIndexedDB;
//prefixes of window.IDB objects
window.IDBTransaction = window.IDBTransaction ||
window.webkitIDBTransaction || window.msIDBTransaction;
window.IDBKeyRange = window.IDBKeyRange || window.webkitIDBKeyRange ||
window.msIDBKeyRange
if (!window.indexedDB) {
window.alert("Your browser doesn't support a stable version of IndexedDB.")
}
var visitorInfo = [{
date : tD,
ip : ip,
city : city,
country: country,
os :os },
];
var db;
var request = window.indexedDB.open("visitor", 1);
request.onerror = function(event) {
console.log("error: ");
};
request.onsuccess = function(event) {
db = request.result;
console.log("success: "+ db);
};
request.onupgradeneeded = function(event) {
var db = event.target.result;
if(!db.objectStoreNames.contains("userinfo")){
console.log("creating userinfo table..");
//var objectStore = db.createObjectStore("userinfo", {keyPath: "ip",autoIncrement:true});
var objectStore = db.createObjectStore("userinfo", {keyPath: "ip"});
}
else{
console.log("userinfo exists");
}
for (var i in visitorInfo) {
objectStore.add(visitorInfo[i]);
}
}
插入对象的代码位于 onupgradeneeded 处理程序中。 onupgradeneeded 处理函数仅在首次创建数据库或增加版本时运行。
另一方面,indexedDB.open 调用的成功处理程序每次都会在创建、升级或刚刚打开数据库时运行。
因此,您想将插入对象的代码从 onupgradeneeded 处理程序移动到成功处理程序中。
我有 运行 访问同样的问题。在我的案例中,有两件事导致了这种情况。
- 如果您已经创建了 table/indexdb,请使用 onsuccess 处理程序。
- 这是愚蠢的部分,但我犯了这个错误。如果您通过浏览器开发人员工具查看数据,当您单击 odjectstore/table 时,indexDB 本身不会更新记录。您必须单击应用程序部分下 indexdb window 上的刷新按钮,以查看记录是否已创建。刷新按钮在数据集的左上角。