In indexedDB in html5 api, I can use it to store key-value pairs. But how can I make sure that after adding a certain key-value, after 1 day, that key should automatically be deleted from the db.
I was thinking of wrapping the value in an object with current datetime, and expiry time, and when u get the value, check the time difference, but is this the best way?
Thanks
Complete HTML/CSS Course 2022The indexeddb is a new HTML5 concept to store the data inside user's browser. indexeddb is more power than local storage and useful for applications that requires to store large amount of the data. These applications can run more efficiency and load faster.
Developers can leverage client storage mechanisms like IndexedDB to improve the user experience of their application by not only persisting state across sessions but also by decreasing the time it takes to load the initial state on repeat visits.
IndexedDB is a low-level API for client-side storage of significant amounts of structured data, including files/blobs. This API uses indexes to enable high-performance searches of this data. While Web Storage is useful for storing smaller amounts of data, it is less useful for storing larger amounts of structured data.
Not slow like a database on a cheap server, even slower! Inserting a few hundred documents can take up several seconds. Time which can be critical for a fast page load.
Yep, what Scott Marcus and dgrogan said. One more hint: if you create an index on the timestamp, you can iterate a cursor over the range of "expired" values and delete them after opening the database.
const open = indexedDB.open("demo");
open.onupgradeneeded = function () {
const db = open.result;
const store = db.createObjectStore("store");
const index = store.createIndex("timestamp", "timestamp");
// Populate with some dummy data, with about half from the past:
for (let id = 0; id < 20; ++id) {
store.put(
{
value: Math.random(),
timestamp: new Date(Date.now() + (Math.random() - 0.5) * 10000),
},
id
);
}
};
open.onsuccess = function () {
const db = open.result;
const tx = db.transaction("store", "readwrite");
// Anything in the past:
const range = IDBKeyRange.upperBound(new Date());
tx
.objectStore("store")
.index("timestamp")
.openCursor(range).onsuccess = function (e) {
const cursor = e.target.result;
if (!cursor) return;
console.log("deleting: " + cursor.key);
cursor.delete();
cursor.continue();
};
// This transaction will run after the first commits since
// it has overlapping scope:
const tx2 = db.transaction("store");
tx2.objectStore("store").count().onsuccess = function (e) {
console.log("records remaining: " + e.target.result);
};
};
Support for automatically expiring IndexedDB and other storage data is being considered. See https://github.com/whatwg/storage/issues/11. It would be helpful if you could describe your use case there.
In the meantime you'll have to do something like you outlined or what Scott Marcus suggests.
IndexedDB can only be modified by code. It has no automatic capabilities. Why not just store the data with a timestamp value and modify your code to remove it when the timestamp is out of date?
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With