Daugeliui žiniatinklio programų reikia naudoti duomenų bazę, kad išsaugotų informaciją apie naudotoją arba nuostatas. Bet ar žinojote, kad kiekvienoje šiuolaikinėje žiniatinklio naršyklėje yra integruota duomenų bazė?

IndexedDB yra kliento NoSQL duomenų bazė, leidžianti saugoti ir gauti struktūrinius duomenis vartotojo žiniatinklio naršyklėje.

IndexedDB suteikia keletą privalumų, pavyzdžiui, didesnę atmintį ir neprisijungus pasiekiamą duomenų saugojimą bei gavimą, palyginti su kitomis saugojimo parinktimis, pvz., „localStorage“. Čia sužinosite, kaip naudoti IndexedDB kaip duomenų bazę.

Duomenų bazės nustatymas

Norėdami sukurti duomenų bazę, turite sukurti atvirą užklausą naudodami IndexedDB atviras metodas. The atviras metodas grąžina an IDBOpenDBRequest objektas. Šis objektas suteikia prieigą prie sėkmė, klaida, ir atnaujintasskleidžiami įvykiai nuo atviros operacijos.

The atviras metodas apima du argumentus: pavadinimą ir pasirenkamą versijos numerį. Vardo argumentas reiškia jūsų duomenų bazės pavadinimą. Versijos numeris nurodo duomenų bazės versiją, su kuria jūsų programa tikisi dirbti. Numatytoji reikšmė yra nulis.

instagram viewer

Štai kaip sukurti atvirą užklausą:

konst openRequest = indexedDB.open("usersdb", 1);

Sukūrus atvirą užklausą reikia išklausyti ir tvarkyti įvykius ant grąžinamo objekto.

The sėkmė įvykis įvyksta, kai sėkmingai sukuriate duomenų bazę. Išsiųstą, gausite prieigą prie savo duomenų bazės objekto per įvykis.tikslas.rezultatas:

openRequest.onsuccess = funkcija (įvykis) {
konst db = event.target.result;
konsolė.log("Sukurta duomenų bazė", db);
};

Aukščiau pateiktame pavyzdyje sėkmės įvykis apdorojamas registruojant duomenų bazės objektą.

The klaida įvykis įvyksta, jei IndexedDB susiduria su problema kuriant duomenų bazę. Galite tai išspręsti užregistruodami klaidą konsolėje arba naudodami kitą klaidų valdymo metodai:

openRequest.onror = funkcija (įvykis) {
// ...
};

The atnaujintas įvykis įvyksta, kai sukuriate duomenų bazę pirmą kartą arba kai atnaujinate jos versiją. Jis užsidega tik vieną kartą, todėl yra ideali vieta kurti daiktų parduotuvę.

Objektų parduotuvės kūrimas

Objektų saugykla yra panaši į lentelę serverio reliacinėse duomenų bazėse. Galite naudoti objektų saugyklą raktų ir reikšmių poroms saugoti.

Turėtumėte sukurti objektų saugyklas, atsakydami į atnaujintas įvykis. Šis įvykis suaktyvinamas, kai sukuriate naują duomenų bazės versiją arba atnaujinate esamą versiją. Taip užtikrinama, kad duomenų bazė būtų tinkamai sukonfigūruota ir atnaujinta prieš įtraukiant bet kokius duomenis.

Galite sukurti objektų parduotuvę naudodami CreateObjectStore metodą, kurį galite pasiekti naudodami savo duomenų bazės nuorodą. Šis metodas naudoja objektų saugyklos pavadinimą ir konfigūracijos objektą kaip argumentus.

Konfigūracijos objekte turite apibrėžti pirminį raktą. Pirminį raktą galite apibrėžti nustatydami rakto kelią, kuris yra visada egzistuojanti ypatybė, kurioje yra unikali reikšmė. Arba galite naudoti raktų generatorių, nustatydami keyPath nuosavybė „id" ir automatinis padidėjimas nuosavybė į tiesa jūsų konfigūracijos objekte.

Pavyzdžiui:

openRequest.onupgradeneeded = funkcija (įvykis) {
konst db = event.target.result;

// Sukurkite objektų parduotuvę
konst userObjectStore = db.createObjectStore("userStore", {
KeyPath: "id",
automatinis padidėjimas: tiesa,
});
}

Šis pavyzdys jūsų duomenų bazėje sukuria objektų saugyklą pavadinimu „userStore“ ir nustato jos pirminį raktą į automatiškai didėjantį ID.

Indeksų apibrėžimas

IndexedDB indeksas yra būdas efektyviau tvarkyti ir gauti duomenis. Tai leidžia ieškoti objektų saugykloje ir rūšiuoti ją pagal indeksuotas savybes.

Norėdami apibrėžti objektų saugyklos indeksą, naudokite CreateIndex() objektų saugyklos objekto metodas. Šis metodas naudoja indekso pavadinimą, ypatybės pavadinimą ir konfigūracijos objektą kaip argumentus:

userObjectStore.createIndex("vardas", "vardas", { Unikalus: klaidinga });
userObjectStore.createIndex("el. paštas", "el. paštas", { Unikalus: tiesa });

Šis kodo blokas aukščiau apibrėžia du indeksus: „vardas“ ir „el. paštas“. userObjectStore. „Vardo“ indeksas nėra unikalus, o tai reiškia, kad keli objektai gali turėti tą pačią pavadinimo reikšmę, o „el. pašto“ indeksas yra unikalus, todėl jokie du objektai negali turėti tokios pačios el. pašto reikšmės.

Čia yra išsamus pavyzdys, kaip galite elgtis su atnaujintas įvykis:

openRequest.onupgradeneeded = funkcija (įvykis) {
konst db = event.target.result;

// Sukurkite objektų parduotuvę
konst userObjectStore = db.createObjectStore("userStore", {
KeyPath: "id",
automatinis padidėjimas: tiesa,
});

// Kurti indeksus
userObjectStore.createIndex("vardas", "vardas", { Unikalus: klaidinga });
userObjectStore.createIndex("el. paštas", "el. paštas", { Unikalus: tiesa });
};

Duomenų įtraukimas į „IndexedDB“.

Operacija IndexedDB yra būdas sugrupuoti kelias skaitymo ir rašymo operacijas į vieną operaciją. Kad būtų užtikrintas duomenų nuoseklumas ir vientisumas, jei viena iš operacijos operacijų nepavyksta, IndexedDB atšaukia visas operacijas.

Norėdami įtraukti duomenis į IndexedDB duomenų bazę, objektų saugykloje, į kurią norite įtraukti duomenis, turite sukurti operaciją ir tada naudoti papildyti() duomenims pridėti.

Sudaryti sandorį galite paskambinę tel sandorį metodą savo duomenų bazės objekte. Šis metodas turi du argumentus: jūsų duomenų saugyklos pavadinimą (-us) ir operacijos režimą, kuris gali būti Tik skaitymui (numatytasis) arba skaityk rašyk.

Tada skambinkite objectStore() operacijos metodą ir perduokite objektų saugyklos, į kurią norite įtraukti duomenis, pavadinimą. Šis metodas grąžina nuorodą į objektų saugyklą.

Galiausiai paskambinkite papildyti() metodą objektų saugykloje ir pateikite norimus pridėti duomenis:

konst addUserData = (userData, db) => {
// Atidarykite operaciją
konst sandoris = db.transaction("userStore", "skaityk rašyk");

// Pridėti duomenis į objektų saugyklą
konst userObjectStore = transakcija.objectStore("userStore");

// Pateikite užklausą pridėti vartotojo duomenis
konst užklausa = userObjectStore.add (userData);

// Tvarkykite sėkmės įvykį
prašymas.sėkmė = funkcija (įvykis) {
//...
};

// Tvarkyti klaidą
prašymas.klaida = funkcija (įvykis) {
//...
};
};

Ši funkcija sukuria operaciją su objektų saugykla „userStore“ ir nustato režimą į „readwrite“. Tada jis gauna objektų parduotuvę ir prideda vartotojo duomenys prie jo naudojant papildyti metodas.

Duomenų gavimas iš IndexedDB

Norėdami gauti duomenis iš IndexedDB duomenų bazės, turite sukurti operaciją objektų saugykloje, iš kurios norite gauti duomenis, ir tada naudoti gauti () arba gauti viską () operacijos metodas duomenims gauti, atsižvelgiant į norimų gauti duomenų kiekį.

The gauti () metodas paima objekto, kurį norite gauti, pirminio rakto reikšmę ir grąžina objektą su atitinkamu raktu iš jūsų objektų saugyklos.

The gauti viską () metodas grąžina visus duomenis objektų saugykloje. Jis taip pat pasirenka neprivalomą apribojimą kaip argumentą ir grąžina visus atitinkančius duomenis iš parduotuvės.

konst getUserData = (id, db) => {
konst sandoris = db.transaction("userStore", "Tik skaitymui");
konst userObjectStore = transakcija.objectStore("userStore");

// Pateikite užklausą gauti duomenis
konst užklausa = userObjectStore.get (id);

prašymas.sėkmė = funkcija (įvykis) {
konsolė.log (request.result);
};

prašymas.klaida = funkcija (įvykis) {
// Tvarkos klaida
};
};

Ši funkcija sukuria operaciją su objektų saugykla „userStore“ ir nustato režimą „tik skaityti“. Tada jis nuskaito naudotojo duomenis su atitinkamu ID iš objektų saugyklos.

Duomenų atnaujinimas naudojant „IndexedDB“.

Norėdami atnaujinti duomenis „IndexedDB“, turite sukurti operaciją „readwrite“ režimu. Tęskite nuskaitydami objektą, kurį norite atnaujinti, naudodami gauti () metodas. Tada pakeiskite objektą ir paskambinkite įdėti () metodą objektų saugykloje, kad išsaugotumėte atnaujintą objektą atgal į duomenų bazę.

konst updateUserData = (ID, vartotojo duomenys, db) => {
konst sandoris = db.transaction("userStore", "skaityk rašyk");
konst userObjectStore = transakcija.objectStore("userStore");

// Pateikite užklausą gauti duomenis
konst getRequest = userObjectStore.get (id);

// Tvarkykite sėkmės įvykį
getRequest.onsuccess = funkcija (įvykis) {
// Gaukite senus vartotojo duomenis
konst vartotojas = event.target.result;

// Atnaujinkite vartotojo duomenis
user.name = vartotojo duomenys.vardas;
user.email = userData.email;

// Pateikite prašymą atnaujinti duomenis
konst putRequest = userObjectStore.put (vartotojas);

putRequest.onsuccess = funkcija (įvykis) {
// Tvarkykite sėkmę
};

putRequest.onror = funkcija (įvykis) {
// Tvarkos klaida
};
};

getRequest.onror = funkcija (įvykis) {
// Tvarkos klaida
};
};

Ši funkcija sukuria operaciją, kad gautų ir atnaujintų jūsų duomenų bazės duomenis.

Duomenų ištrynimas iš IndexedDB

Norėdami ištrinti duomenis iš IndexedDB, turite sukurti operaciją „skaitymo rašymo“ režimu. Tada skambinkite Ištrinti() metodas objektų saugykloje, kaip pašalinti objektą iš duomenų bazės:

konst deleteUserData = (id, db) => {
konst sandoris = db.transaction("userStore", "skaityk rašyk");
konst userObjectStore = transakcija.objectStore("userStore");

// Pateikite prašymą ištrinti duomenis
konst užklausa = userObjectStore.delete (id);

prašymas.sėkmė = funkcija (įvykis) {
// Tvarkykite sėkmę
};

prašymas.klaida = funkcija (įvykis) {
// Tvarkos klaida
};
};

Ši funkcija sukuria operaciją, kuri ištrina duomenis su atitinkamu ID iš jūsų objektų saugyklos.

Ar turėtumėte naudoti „IndexedDB“ ar „localStorage“?

Pasirinkimas tarp „IndexedDB“ ir kitų kliento duomenų bazių, tokių kaip „localStorage“, priklauso nuo jūsų programos reikalavimų. Naudokite vietinę saugyklą, kad galėtumėte paprastai saugoti nedidelius duomenų kiekius. Pasirinkite IndexedDB dideliems struktūriniams duomenų rinkiniams, kuriems reikia užklausų ir filtravimo.