Често срещани решения за съхранение на данни за преден край включват:Cookie、Web Storage、IndexedDB、WebSQL、local Storage、session Storageи т.н., например:
| характерен | бисквитка | localStorage | sessionStorage | indexedDB | | Жизнен цикъл на данните | Обикновено се генерира от сървъра и времето за изтичане може да бъде зададено; Могат да се генерират и компоненти като front-end приемане и js-cookie | Освен ако не е почистена, тя винаги е там; Когато браузърът е затворен, той също се запазва локално, но крос-браузър не се поддържа | Почистването и обновяването на страницата ще съществува, когато страницата е затворена, а взаимодействието между страниците не се поддържа | Освен ако не бъде почистен, той винаги е съществувал | | Размерът на хранилището за данни | 4K | 5M | 5M | Няма ограничение на размера | | Комуникация със сървъра | Той се носи в искания хедър всеки път, което влияе на изпълнението на заявката; В същото време, тъй като е включен в заявката, е податлив и на проблеми със сигурността | Не участвам | Не участвам | Не участвам | | Особеност | Низовите двойки ключ-стойност съхраняват данните локално | Низовите двойки ключ-стойност съхраняват данните локално | Низовите двойки ключ-стойност съхраняват данните локално | IndexedDB е нерелационна база данни (операции чрез SQL оператори не се поддържат). Той може да съхранява големи количества данни, да предоставя интерфейси за заявки и да изгражда индекси, които другите решения за съхранение не могат да осигурят. |
IndexedDB
Тази статия основно описва използването на IndexedDB за фронт-енд съхранение и е представена по следния начин:
IndexedDB е основен API за съхранение на големи количества структурирани данни (също файлове/бинарни големи обекти (blobs)) от страна на клиента. API използва индекси, за да позволи високопроизводително търсене на данни. Въпреки че уеб съхранението е полезно за съхранение на по-малки количества данни, то не е толкова добро, колкото съхранението на по-големи количества структурирани данни. IndexedDB предоставя решение за този сценарий. Тази страница е основната страница с ръководство за MDN IndexedDB – тук предоставяме пълно ръководство за препратка и използване на API, подробности за поддръжка на браузъра и връзки към някои обяснения на ключови концепции.
IndexedDB има следните функции:
(1) Съхранение на двойки ключ-стойност. IndexedDB използва обектно хранилище за съхранение на данни. Всички видове данни могат да се депозират директно, включително JavaScript обекти. В обектното хранилище данните се съхраняват под формата на "двойки ключ-стойност", като всеки запис има съответния първичен ключ, който е уникален и не може да бъде дублиран, в противен случай ще се появи грешка.
(2) Асинхронно. IndexedDB не заключва браузъра и потребителят все още може да извършва други операции, за разлика от LocalStorage, който работи синхронно. Асинхронният дизайн цели да предотврати четене и записване на големи обеми данни, забавяйки производителността на уеб страниците.
(3) Поддържащи въпроси. IndexedDB поддържа транзакции, което означава, че ако една от стъпките на операцията се провали, цялата транзакция ще бъде анулирана и базата данни ще бъде върната в състоянието преди извършването на транзакцията, без да се пренаписва само част от данните.
(4) Ограничение на хомологията. IndexedDB подлежи на същия лимит на произход, а всяка база данни съответства на домейна, което я е създало. Уеб страниците могат да имат достъп до бази данни само под собствените си домейни, а не с бази данни с различни домейни.
(5) Голямо място за съхранение. IndexedDB има много по-голямо пространство за съхранение от LocalStorage, обикновено не по-малко от 250MB, и няма горна граница.
(6) Поддръжка на двоично съхранение. IndexedDB може да съхранява не само низове, но и двоични данни (обекти ArrayBuffer и обекти Blob).
Ако е трудно да започнете директно с IndexedDB и трябва сами да го капсулирате, можете да използвате някои пакетирани пакети, както следва:
- localForage: Прост Polyfill, който предоставя прост синтаксис на стойности за клиентски хранилища на данни. Използва IndexedDB във фонов режим и се връща към WebSQL или localStorage в браузъри, които не поддържат IndexedDB.
- Dexie.js: Обвивките на IndexedDB позволяват по-бързо разработване на код чрез прост синтаксис.
- ZangoDB: Интерфейс за IndexedDB, подобен на MongoDB, поддържащ повечето от познатите функции за филтриране, проекция, сортиране, обновяване и агрегиране на MongoDB.
- JsStore: IndexedDB обвивка с SQL синтаксис.
- MiniMongo: MongoDB в клиентската памет, поддържана от localstorage, сървърна синхронизация чрез http. MeteorJS използва MiniMongo.
- PouchDB: Клиент, който реализира CouchDB в браузъра с помощта на IndexedDB.
- idb: Малка (〜1.15k) библиотека с по-голямата част от API-то, подобна на IndexedDB, но с някои малки подобрения, които значително подобряват използваемостта на базата данни.
- idb-keyval: Супер просто и малко (~600B) обещаващо базирано на двойка ключ-стойност, реализирано с IndexedDB.
- sifrr-storage: Много малка (~2kB) база данни, базирана на обещания, базирана на клиентски ключови стойности. Реализиран на базата на IndexedDB, localStorage, WebSQL и бисквитки. Той може автоматично да избира поддържаните бази данни, споменати по-горе, и да ги използва в ред на приоритет.
- lovefield: Lovefield е релационна база данни за уеб приложения, написана на JavaScript, може да работи в различни браузърни среди и предоставя SQL-подобен API, който е бърз, сигурен и лесен за използване.
localForage
localForage е бърз и прост JavaScript хранилище. localForage подобрява офлайн изживяването на уеб приложенията чрез използване на асинхронно съхранение (IndexedDB или WebSQL) и прост API, подобен на localStorage. localForage използва localStorage в браузъри, които нямат поддръжка на IndexedDB или WebSQL.
GitHub адрес:Входът към хиперлинк е видим.
Урок по китайски:Входът към хиперлинк е видим.
localForage предоставя два различни js файла, като разликите са следните:
localforage.js: a Promise библиотека, съдържаща реализацията на lie (Входът към хиперлинк е видим.), файлът е сравнително голям, а синтаксисът promise може да се използва в по-стари браузъри.
localforage.nopromises.js: Няма реализация на Promise, поддържат се само нови версии на браузъри.
Тестов код:
(Край)
|
Публикувано в 12.10.2023 г. 20:42:27 ч.
|
|
|
|
Хазяин|
Публикувано в 2.03.2025 г. 19:12:18 ч.
|
