Izplatītākie front-end datu glabāšanas risinājumi galvenokārt ietver:Cookie、Web Storage、IndexedDB、WebSQL、local Storage、session Storageutt., piemēram:
| raksturīgs | sīkdatne | vietējā krātuve | sesijaKrātuve | indexedDB | | Datu dzīves cikls | Parasti ģenerē serveris, derīguma termiņu var iestatīt; Var ģenerēt arī tādus komponentus kā front-end pieņemšana un js-cookie | Ja vien tas nav iztīrīts, tas vienmēr ir tur; Kad pārlūkprogramma ir aizvērta, tā tiek saglabāta arī lokāli, bet vairāku pārlūkprogrammu netiek atbalstīta | Lapas tīrīšana un atsvaidzināšana joprojām pastāvēs, kad lapa ir aizvērta, un starplappušu mijiedarbība netiek atbalstīta | Ja vien tas nav iztīrīts, tas vienmēr ir pastāvējis | | Datu krātuves lielums | 4K | 5 miljoni | 5 miljoni | Bez lieluma ierobežojuma | | Sazinieties ar serveri | Tas katru reizi tiek veikts pieprasītajā galvenē, kas ietekmē pieprasījuma izpildi; Tajā pašā laikā, tā kā tas ir iekļauts pieprasījumā, tas ir pakļauts arī drošības problēmām | Nepiedalās | Nepiedalās | Nepiedalās | | Īpatnība | Virknes atslēgas un vērtības pāri glabā datus lokāli | Virknes atslēgas un vērtības pāri glabā datus lokāli | Virknes atslēgas un vērtības pāri glabā datus lokāli | IndexedDB ir nerelāciju datu bāze (operācijas, izmantojot SQL paziņojumus, netiek atbalstītas). Tas var glabāt lielu datu apjomu, nodrošināt saskarnes vaicājumiem un veidot indeksus, ko citi glabāšanas risinājumi nevar nodrošināt. |
IndexedDB
Šajā rakstā galvenokārt aprakstīta IndexedDB izmantošana priekšgala krātuvei, un tas ir ieviests šādi:
IndexedDB ir pamatā esoša API liela apjoma strukturētu datu glabāšanai (arī failu / bināro lielo objektu (blobs)) klienta pusē. API izmanto indeksus, lai iespējotu augstas veiktspējas datu meklēšanu. Lai gan tīmekļa krātuve ir noderīga mazāku datu apjomu glabāšanai, tā nav tik laba kā lielāks strukturēto datu apjoms. IndexedDB nodrošina risinājumu šim scenārijam. Šī lapa ir galvenā MDN IndexedDB ceļveža lapa - šeit mēs sniedzam pilnu API atsauces un lietošanas rokasgrāmatu, pārlūkprogrammas atbalsta informāciju un saites uz dažiem galveno jēdzienu skaidrojumiem.
IndexedDB ir šādas funkcijas:
(1) Atslēgas-vērtības pāra krātuve. IndexedDB datu glabāšanai izmanto objektu krātuvi. Visu veidu datus var deponēt tieši, ieskaitot JavaScript objektus. Objektu repozitorijā dati tiek glabāti "atslēgas-vērtību pāru" veidā, un katram datu ierakstam ir atbilstoša primārā atslēga, kas ir unikāla un to nevar dublēt, pretējā gadījumā tiks izmesta kļūda.
(2) Asinhrons. IndexedDB nebloķē pārlūkprogrammu, un lietotājs joprojām var veikt citas darbības, atšķirībā no LocalStorage, kas darbojas sinhroni. Asinhronais dizains ir paredzēts, lai novērstu lielu datu apjomu lasīšanu un rakstīšanu, palēninot tīmekļa lapu veiktspēju.
(3) Atbalsta lietas. IndexedDB atbalsta darījumus, kas nozīmē, ka, ja kāds no operācijas soļiem neizdodas, viss darījums tiks atcelts, un datu bāze tiks atgriezta stāvoklī pirms darījuma notikšanas, un nav gadījuma, kad pārrakstītu tikai daļu datu.
(4) Homoloģijas ierobežojums. IndexedDB ir pakļauts vienam un tam pašam izcelsmes ierobežojumam, un katra datu bāze atbilst domēna nosaukumam, kas to izveidoja. Web lapas var piekļūt datu bāzēm tikai ar saviem domēnu nosaukumiem, nevis starpdomēnu datu bāzēm.
(5) Liela uzglabāšanas telpa. IndexedDB ir daudz lielāka krātuves vieta nekā LocalStorage, parasti ne mazāk kā 250 MB, un nav augšējā ierobežojuma.
(6) Atbalstiet bināro krātuvi. IndexedDB var glabāt ne tikai virknes, bet arī bināros datus (ArrayBuffer objektus un Blob objektus).
Ja ir grūti sākt tieši ar IndexedDB un jums tas ir jāiekapsulē pats, varat izmantot dažas iepakotas paketes šādi:
- localForage: vienkāršs Polyfill, kas nodrošina vienkāršu vērtību sintaksi klienta puses datu krātuvēm. Tas fonā izmanto IndexedDB un atgriežas WebSQL vai localStorage pārlūkprogrammās, kas neatbalsta IndexedDB.
- Dexie.js: IndexedDB iesaiņojumi ļauj ātrāk izstrādāt kodu, izmantojot vienkāršu sintaksi.
- ZangoDB: IndexedDB interfeiss, kas līdzīgs MongoDB, kas atbalsta lielāko daļu MongoDB pazīstamo filtrēšanas, projekcijas, šķirošanas, atjaunināšanas un apkopošanas funkciju.
- JsStore: IndexedDB iesaiņojums ar SQL sintaksi.
- MiniMongo: MongoDB klienta atmiņā, ko atbalsta vietējā krātuve, servera sinhronizācija, izmantojot http. MeteorJS izmanto MiniMongo.
- PouchDB: klients, kas pārlūkprogrammā ievieš CouchDB, izmantojot IndexedDB.
- idb: Neliela (〜1.15k) bibliotēka ar lielāko daļu API, kas līdzīga IndexedDB, bet ar dažiem nelieliem uzlabojumiem, kas ievērojami uzlabo datu bāzes lietojamību.
- idb-keyval: Ļoti vienkārša un maza (~600B) uz solījumiem balstīta atslēgu-vērtību pāru krātuve, kas ieviesta ar IndexedDB.
- sifrr-storage: ļoti maza (~2kB) uz solījumiem balstīta klienta puses atslēgas-vērtības datu bāze. Ieviests, pamatojoties uz IndexedDB, localStorage, WebSQL un sīkfailiem. Tas var automātiski atlasīt iepriekš minētās atbalstītās datu bāzes un izmantot tās prioritātes secībā.
- Lovefield: Lovefield ir relāciju datu bāze tīmekļa lietotnēm, kas rakstīta JavaScript, var darboties dažādās pārlūkprogrammu vidēs un nodrošina SQL līdzīgu API, kas ir ātra, droša un viegli lietojama.
vietējā lopbarība
localForage ir ātrs un vienkāršs JavaScript repozitorijs. localForage uzlabo tīmekļa lietojumprogrammu bezsaistes pieredzi, izmantojot asinhronu krātuvi (IndexedDB vai WebSQL) un vienkāršu API, kas līdzīga localStorage. localForage izmanto localStorage pārlūkprogrammās, kurām nav IndexedDB vai WebSQL atbalsta.
GitHub adrese:Hipersaites pieteikšanās ir redzama.
Ķīniešu apmācība:Hipersaites pieteikšanās ir redzama.
localForage nodrošina divus dažādus js failus, atšķirības ir šādas:
localforage.js: solījumu bibliotēka, kas satur melu ieviešanu (Hipersaites pieteikšanās ir redzama.), fails ir salīdzinoši liels, un solījuma sintaksi var izmantot vecākās pārlūkprogrammās.
localforage.nopromises.js: Solījums netiek ieviests, tiek atbalstītas tikai jaunas pārlūkprogrammu versijas.
Testa kods:
(Beigas)
|
Publicēts 12.10.2023 20:42:27
|
|
|
|
Saimnieks|
Publicēts 02.03.2025 19:12:18
|
