Які браузери підтримують IndexedDB

IndexedDB: що це за папка і чи можна її видалити?

IndexedDB - це вбудована база даних, вбудована в браузер, яка дозволяє веб-застосункам зберігати і маніпулювати великими обсягами даних. В основному IndexedDB є способом зберігання даних на стороні клієнта, на відміну від баз даних, які зберігаються на серверах.

IndexedDB є ключ-значення бази даних, що означає, що кожен запис в базі даних містить набір пар ключ-значення. Крім того, IndexedDB надає можливість виконувати запити, індексувати дані та виконувати транзакції, подібно до SQL баз даних.

Тепер давайте поговоримо про папку, пов'язану з IndexedDB. У кожному браузері, який підтримує IndexedDB, є спеціальна папка, де зберігаються дані, пов'язані з IndexedDB. Однак, не можна просто так видалити папку. При видаленні цієї папки можна втратити всі дані, що зберігаються в IndexedDB, які можуть бути важливими для функціональності веб-додатків.

Таким чином, хоча IndexedDB надає зручний спосіб зберігання даних на стороні клієнта, не можна просто так видалити пов'язану з ним папку, щоб позбавитися даних. Якщо потрібно видалити дані, вам слід використовувати код Javascript або методи API IndexedDB для видалення даних, або скористатися функціями самого веб-додатка, пов'язаними з базою даних IndexedDB.

Що таке IndexedDB і навіщо вона потрібна?

Основна перевага IndexedDB полягає в тому, що вона дозволяє зберігати дані безпосередньо на стороні клієнта, забезпечуючи швидкий та надійний доступ до цих даних навіть за відсутності інтернет-з'єднання.

IndexedDB може використовуватися для створення різних типів веб-застосунків, таких як офлайн-додатки, щоденники, календарі, нотатки та багато іншого. Завдяки можливості зберігати дані локально на пристрої користувача, веб-програми можуть бути більш гнучкими, потужними та надійними.

Крім того, IndexedDB також дозволяє індексувати та шукати дані з використанням різних методів, що робить пошук та обробку даних ефективнішим та зручнішим для розробників.

Що таке IndexedDB?

IndexedDB надає API для зберігання та вилучення даних у форматі пар ключ-значення. Вона підтримує багато різних типів даних, включаючи рядки, числа і навіть масиви або об'єкти JavaScript. Операції додавання, оновлення, видалення та пошуку даних виконуються асинхронно, що дозволяє браузеру продовжувати відповідати на запити користувача без блокування інтерфейсу.

IndexedDB є частиною специфікації HTML5 та підтримується більшістю сучасних браузерів, включаючи Chrome, Firefox, Safari та Edge. Вона дозволяє створювати потужні веб-програми, такі як оффлайн-редактори, сховища даних та ігри, які можуть працювати без постійного підключення до Інтернету.

Отже, IndexedDB дозволяє розробникам створювати більш потужні та інтерактивні веб-програми, забезпечуючи браузеру потужні можливості зберігання та обробки даних на стороні клієнта.

Навіщо потрібна IndexedDB?

Він є нереляційною базою даних, заснованою на ключ-значення, де кожен об'єкт даних має унікальний ідентифікатор. IndexedDB дозволяє зберігати дані та структурувати їх у колекції об'єктів чи сховищах.

Основні переваги IndexedDB:

Відсутність потреби у підключенні до інтернету. IndexedDB зберігає дані локально, тому програми можуть працювати в автономному режимі.
Місткість. На відміну від куки або localStorage, IndexedDB може зберігати велику кількість даних – до кількох гігабайт.
Висока продуктивність. Завдяки можливості використання індексів для швидкого доступу до даних IndexedDB дозволяє виконувати запити та пошук по сховищу з мінімальними накладними витратами.
Транзакційність. IndexedDB забезпечує надійність і цілісність даних, дозволяючи виконувати операції у межах однієї чи кількох транзакцій.
Можливість роботи з великим обсягом асинхронних операцій. IndexedDB надає API, що дозволяє виконувати запити та маніпулювати даними асинхронно.

Разом з тим, основним недоліком IndexedDB є складність його використання в порівнянні з більш простими способами зберігання даних, такими як куки або localStorage.

IndexedDB та веб-браузери

IndexedDB є частиною стандарту HTML5 та підтримується більшістю сучасних веб-браузерів, включаючи Google Chrome, Mozilla Firefox, Microsoft Edge, Safari та Opera.

Веб-розробники можуть використовувати IndexedDB для створення потужних веб-застосунків, які можуть працювати в офлайн-режимі та синхронізуватися з сервером при підключенні до Інтернету IndexedDB пропонує гнучку модель зберігання даних і підтримує індекси, транзакції та запити.

IndexedDB може бути використано для збереження різної інформації, такої як налаштування користувача, кешовані дані, журнали подій, локальні бази даних і багато іншого.

Важливо зазначити, що видалення папки IndexedDB може призвести до втрати всіх даних, які зберігаються в ній.

Які браузери підтримують IndexedDB?

IndexedDB підтримується більшістю сучасних браузерів, включаючи:

Google Chrome: версія 23 та вище.
Mozilla Firefox: версія 16 та вище.
Microsoft Edge: версія 12 (для EdgeHTML) та вище.
Safari: версія 10 та вище.
Opera: версія 15 та вище.

Крім того, IndexedDB підтримується у багатьох мобільних браузерах, таких як Mobile Safari, Chrome для Android та інші.

Якщо ви розробляєте веб-додаток, який використовує IndexedDB, рекомендується перевірити сумісність із різними браузерами та версіями, щоб переконатися, що ваша програма працює належним чином на всіх пристроях та платформах.

Як увімкнути підтримку IndexedDB у браузері?

Щоб увімкнути підтримку IndexedDB у браузері, виконайте такі кроки:

Відкрийте Google Chrome і введіть у адресному рядку chrome://flags
Знайдіть "IndexedDB" у списку опцій та увімкніть його
Перезапустіть браузер

Відкрийте Mozilla Firefox і введіть адресний рядок about:config
Підтвердьте попередження
Знайдіть параметр "dom.indexedDB.enabled" та встановіть його значення "true"

Відкрийте Microsoft Edge і введіть адресний рядок about:flags
Знайдіть "IndexedDB" у списку опцій та увімкніть його
Перезапустіть браузер

Відкрийте Safari та виберіть у меню "Параметри"
Перейдіть на вкладку "Розширені"
Активуйте "Показувати меню Розробка у рядку меню"
Виберіть у меню "Розробка" пункт "Дозволити всім сайтам використовувати бази даних IndexedDB"

Після ввімкнення підтримки IndexedDB у браузері, ви зможете використовувати всі функціональні можливості цієї технології на веб-сторінках.

Видалення папки IndexedDB

Папка IndexedDB містить сховище даних, яке створюється та використовується веб-застосунками для збереження інформації на локальному пристрої. У цій папці зберігаються бази даних, а також їх таблиці та індекси.

Видалення папки IndexedDB можливе, але слід бути обережним при цьому. Видалення цієї папки може призвести до втрати даних веб-застосунків, які використовують IndexedDB для зберігання інформації на вашому пристрої. Тому перед видаленням папки рекомендується зробити резервну копію даних, якщо це можливо.

Якщо ви все ж таки вирішите видалити папку IndexedDB, для цього потрібно виконати наступні дії:

Відкрийте провідник на вашому пристрої.
Перейдіть до каталогу, де знаходиться папка IndexedDB.Це може бути різним залежно від операційної системи та браузера, який ви використовуєте.
Знайдіть папку з назвою IndexedDB і виділіть її.
Натисніть правою кнопкою миші на виділену папку та виберіть "Видалити".
Підтвердьте видалення папки, якщо вам буде запропоновано зробити це.

Після виконання цих кроків папка IndexedDB буде видалена з вашого пристрою. копію даних або спробувати інші методи вирішення проблеми, якщо вони є.

Чи можна безпечно видалити папку IndexedDB?

Якщо ви повністю видалите папку IndexedDB, це може призвести до втрати даних, які були збережені у веб-додатках.

Однак, якщо ви хочете очистити папку IndexedDB від конкретних даних, ви можете зробити це без будь-яких небажаних наслідків.

Таким чином, видалення папки IndexedDB може бути безпечною дією, якщо ви знаєте, які дані ви видаляєте і що вони не є важливими для вас або для роботи веб-застосунків.

Як видалити папку IndexedDB?

Якщо потрібно видалити папку IndexedDB, ви можете виконати такі кроки:

Відкрийте веб-браузер і перейдіть до налаштувань.
Знайдіть розділ конфіденційності або безпеки.
У цьому розділі потрібно знайти вкладку "Очистити дані браузера" або щось подібне.
У вікні виберіть "Видалити всі дані" або аналогічний варіант.
Переконайтеся, що вибрано "Історія перегляду", "Файли cookie" та "Кеш" для видалення.
Натисніть кнопку "Очистити дані" або аналогічну.
Після завершення процесу очищення папка IndexedDB повинна бути видалена з вашого пристрою.

Зверніть увагу, що видалення папки IndexedDB може призвести до втрати даних, пов'язаних із веб-застосунками, які використовують цю базу даних. Тому перед видаленням рекомендується створити резервну копію важливих даних або проконсультуватися з розробниками веб-застосунків.

How to Use IndexedDB – У In-Depth Guide for Developers

IndexedDB є потужним, іще підвикористовуваною системою збереження API, доступною в усіх сучасних браузерах. Це in-depth guide aims to change that by providing expert techniques and analysis for leveraging IndexedDB effectively in your web applications.

We'll cover querying complex data, optimal schema design, offline synchronization strategies, cross browser testing, security best practices and even examine how indexes work under the hood.

By the end, you’ll має knowledge to build snappy offline-first apps that rival native apps in user experience.

Overview of IndexedDB Capabilities

Як вступник, let's analyze some key capabilities of IndexedDB:

Massive Storage

Може store up to hundreds of GB with partitioning. Суттєво висока, ніж інші інструменти браузера options.
Storage limits vary across browsers but around 50-250MB per origin is common. Кілька браузерів можуть збільшити це.

Firefox - 50МБ для origin Chrome - Тенни або гібриди GB з temporary permission Safari - Мультимедіа (MB)

Full Transaction Support

Transactions ensure atomicity, consistency and isolation між reads/writes.
Handles concurrency control коли accessed across browser tabs/windows.
Queues requests when offline for smooth synchronization when back online.

Indexed Data Structures

Створюють B-trees і інші indexи для того, щоб зробити ефективний sorting/range queries.
Enables compound multi-field queries не можна в simple key-value stores.

Flexible Schema

Stores data як key-value pairs witheeeding predefined tables/relations.
Values can be flexible JavaScript objects allowing nested properties.
Ad hoc indexes can be created later as needed.

Ця комбінація versatility and performance makes IndexedDB unique among browser storage solutions. Додаткові можливості translate в деякі життєві реальні світові використання випадків:

Key Applications of IndexedDB

Тут є деякі відомості про популярні web apps, що свідчать про великі можливості IndexedDB:

Google Docs/Sheets

Stores document contents for real-time collaboration and offline editing. Syncs changes incrementally when back online.

CAD & 3D Modeling Software

Дозволяє сприятливого поводження з комплексними 3D-моделями з instant saving and undo capabilities. Full persistence with offline support.

Assistive Web Apps

Забезпечує надійність для сприятливих інструментів для тих, що мають здібності. Functions property withnetwork access.

Ad Strategy Platforms

Stores великі обсяги analytics data gathered for creating targeted advertising campaigns. Enables complex ad hoc querying.

Mapping/Navigation Sites

Caches map tile images along with landmarks index for lightning fast rendering and lookups for navigation apps.

Multiplayer Games

Game state послідовно synced across devices for lag free synchronized gameplay. Game data stored across sessions.

Це показує versatility IndexedDB, що усуває його відносно низькою рівнем природи як API.

Now let’s get deeper into how it actually works starting with how data is structured…

IndexedDB Data Storage Model

IndexedDB provides object-oriented database paradigms одразу, ніж рівний model SQL SQLBase. Data is primaryly stored and retrieved using object references rather than joining tables.

However, IndexedDB продовжує використовувати indexи під час scén до всіх ефективних віртуальних речей і sorting over object properties. Це ведеться в hybrid, best-of-both approach:

Як highlighted before, the top level unit is the database. A database contains multiple object stores. Within stores, individual records consist of key/value pairs:

Database -> ProductsStore -> Key1: -> Key2: -> UsersStore -> 2:

The key служить як unique identifier within a store. This can be:

An auto-incrementing integer (1, 2, 3…)
A string like a GUID (Globally Unique ID)
A path pointing to a property like name above.

Now that you understand this simple but versatile data model, let's learn how databases are created…

Creating the Database Structure

IndexedDB наступні як стандартний формат для ініціалізації:

Open database using indexedDB.open()
Check for version change to modify the structure
Create object stores and indexes

Here is sample code to create a simple database:

let db; // Opens database 'shop' const openRequest = indexedDB.open('shop', 1); // Triggers if version updated openRequest.onupgradeneeded = event => < // Get reference to db db = event.target.result; // Create store const productsStore = db.createObjectStore('products', < // Use 'id' as key keyPath: 'id' >); // Create index on 'name' productsStore.createIndex('name', 'name'); >; openRequest.onsuccess = () => < // Start adding data db.addProduct(); >;

Це створюється на базі даних, що називаються shop і object store products with key generator and index. Виникли в onupgradeneeded event to initialize.

Now let’s understand how indexes work and the divers types available…

За допомогою Indexes for Performant Queries

Indexes act like signposts, дозволяючи database to quickly look up records by given property such as name or price .

Internally, IndexedDB uses B-trees і інші балансовані фонові структури для організації indexes для ефективного traversal, sorting and range queries:

Існують кілька типів index категорії:

Default Key Index

Дефектний index на keyPath використовується для унікальних identify records.

Single-Field Index

Додаткові indexи створені на одній особливості besides keyPath.

Multi-Entry Index

Компонентний індекс з множиною keyFields specified. Allows combined queries.

Unique Index

Відомості indexed property contains no duplicates across records.

Array Index

Values stored in array може бути ефективно indexed. Matches if query value is in array.

Let's see an example index multi-entry:

// Index over name and price store.createIndex('productIndex', ['name', 'price']); // Can 's query by price & name combined store.index('productIndex') .getAll(['Milk', 10]);

Це показує потужність індексів! Now let’s discuss how to optimize them…

IndexedDB Performance & Optimization

IndexedDB delivers excelent performance для JavaScript базується на 데이터베이스. Але тут деякі типи для отримання most speed:

Utilize indexes for all common queries as scans are expensive
Analyze query patterns перша і фокус optimization effort appropriately
Partition stores with large data in smaller chunks
Limit transactions to critical operations only
Reuse requests instead of incurring initialization costs
Reduce bloat and index rarely needed old data

Як стандартний веб-дизайн для IndexedDB performance is JsVikings test.

On an average mid-range Samsung S10 device this achieves:

Now let’s explore partitioning techniques to scale storage…

Partitioning Data in IndexedDB

На обмеження IndexedDB є найбільша браузерів поточного граничного проміжку розміру до кількох кількох MB для початкового максимуму. Performance as declines for very large object stores.

The solution is to leverage key ranges до partition data в separate chunks split across stores.

Для прикладу, продукція може бути divided в категорії, використовуючи prefixes:

db -> products_a_f -> products_g_m -> products_n_z

Records starting with A-F in one store, G-M in second etc. Це divides storage and improves lookup speed.

Key issue is choosing partition points based on access patterns.Regular reshuffling may be needed as data grows over time.

Now let’s discuss reliability…

Offline Support & Synchronization

Key benefit of IndexedDB is seamless offline support. Коли мережа access goes down, read/write operations міцно продовжує працювати на цій місцевості.

За рамкамиіндексованихDB потрібні всі потреби використовуючи систему synchronization. Коли зв'язки resumes, ці потрібні листи і трансакції є блискуче merged back ensuring consistency:

However to reduce conflicts, operations should be idempotent where possible. Applies changes only once despite possible retries.

Synchronization і conflict resolution логічний може бути більш customized звідки наповні callback.

Now onto testing across browsers…

Cross-Browser Testing Strategies

While all modern evergreen browsers support IndexedDB, implementations have diverged a bit:

Chrome - Full support Firefox - Some minor API gaps Safari - Налагоджений API due to user tracking concerns IE10/11 - Supported with prefixes

Prefixes required for older IE versions
Safari limits compound indexes to 2 fields
Restricts Номер index keys and values per store
Transaction lifetimes and scope vary

Цей rigorous browser testing is essential. Solving issues like:

Feature detecting properties
Wrapping engine prefixes
Polyfilling missing features
Normalizing behavior through adapters

Automated testing tools як Karma and benchmarking suites є highly advised.

Now onto security propertiesoffered…

IndexedDB Security Model

Відповідь його висока довжина обмежень, збереження безпеки є критичною для IndexedDB. Here are some protections offered:

Isolated by Origin

Database access limited to same origin. Інші сіті включають subdomains може не access data. Help contain XSS attacks.

Powerful Same-Origin Policy

Досвідчений контроль над прямим доступом до iframes and child windows possible. Can selectively block scripts.

Protocol Isolation

Adds protection against man-in-the-middle attacks. HTTPS функцій неможна використовувати HTTP database і vice versa.

Storage Quotas

Більшість браузерів є коротким, щоб почати кілька MBs поточно і може бути приємно для великої додаткової обробки.

Immutable Objects

Прописані об'єкти cloned before being mutated internally. Callers don’t mutate state directly.

Ця комбінація дає змогу балансу функціональності з захистом від web security issues.

Additional Tips for Developers

Тут є певні tips for smooth IndexedDB application development:

Wrap all operations in transactions до maintain consistency
Prefer async/await code over chainged promises for readability
Use Dexie, PouchDB або localForage libraries для зменшення boilerplate
Create layer over IDB providing hooks for common processes як user login state
Handle all failures/rejections instead of crashing app
Disable during development to persist test data easily across reloads
Utilize Service Workers для periodic background syncing
Compare with LocalForage option for simple storage needs

Я роблю це керування, що було зроблено як досконалий, так і практичний dive в IndexedDB. Let me know in comments if you have any other tips for leveraging це versatile API!

References

Related,

Dr. Alex Mitchell є dedicated coding інструктор з глибоким passion for teaching і здоров'я experiència in computer science education. As a university professor, Dr. Mitchell був відіграваний піснею роллю в shaping the coding skills of countless students, helping them navigate intricate world of programming languages and software development.

Beyond the classroom, Dr. Mitchell is active contributor to freecodeCamp community, де його регулярно shares його кваліфікації через tutorials, коди прикладів, і практичні insights. Його вивчають репертуари, включаючи широке число слів і рамок, так само як Python, JavaScript, Next.js, і React, які були зроблені в accessible and engaging manner.

Dr.Mitchell's approach to teaching blends academic rigor with real-world applications, засмучуючи, що його школярі не тільки підтримують теорію, але також, як це apply it effectively. Його поділ на освіту і його здатність до простих комплексних топиків мають зроблену ним, щоб помітити фігуру в школі університету і онлайн навчання комунікації.

Quick but complete guide to IndexedDB and storing data in browsers

IndexedDB є одним з майнових можливостей, введених в браузери за роки. Це є key/value store (a noSQL database) the definitive solution for storing data in browsers.

Він є асинхронним API, який означає, що регулярні оперативні операції не блокують UI thread, що забезпечує незліченну освіту для користувачів. Це може бути невизначеним обсягом даних, але тільки через певне значення, щоб скористатися користувачем, що наближається до мережі великих обмежень.

Це supports transactions, versioning and gives good performance.

Inside the browser we can also use:

Cookies: can host a very small amount of strings
Web Storage (або DOM Storage), на терміні, що аналогічно identifies localStorage and sessionStorage, два key/value stores. sessionStorage, does not retain data, which is cleared when the session ends, while localStorage keeps the data across sessions

Local/session storage має disadvantage of being capped at amall (and inconsistent) size, with browsers implementation offering from 2MB to 10MB of space per site.

In the past we also had Web SQL, a wrapper around SQLite, але now this is deprecated and unsupported на деякі сучасні браузери, це невідповідно буде визнано стандартом і тому він не повинен бути використаний, алез 83% користувачів мають цю технологію на своїх моделях, що відповідають Can I Use.

While you can technically create multiple databases per site, you generally create one single database, and inside that database you can create multiple object stores.

A database is private to a domain, so any other site cannot access another website IndexedDB stores.

Each store usually contains a set of things, які можуть бути

Для того, щоб я могла мати store що contains posts, інші that contains comments.

Store contains number of items which have unique key, which represents the way by which an object can be identified.

Ви можете в будь-який інший магазин, використовуючи transactions, виконуючи add, edit and delete operations, і iterating over thetems they contain.

Відсутність advent Promises в ES6, і subsequent move of APIs до використання promises, IndexedDB API seems a bit old school.

У той час, коли ви не знайдете в ньому, у всіх виразах, що вони викладають їх, використовуючи IndexedDB.

Цей library є також використаний на всіх накладах на Google Developers website regarding IndexedDB

Create an IndexedDB Database

The simplest way is to use unpkg, by adding this to the page header:

script
type="module">
import
< openDB, deleteDB >from
'https://unpkg.com/idb?module'
 script>

Перед використанням IndexedDB API, будь-який ви можете скористатися ним для підтримки в браузері, навіть якщо це незмінно можлива, ви не впевнені, що браузер user is using:

(() =>
< 'use strict'
if (!('indexedDB'
in
window)) < console.warn('IndexedDB not supported') return >
//. IndexedDB code >)()

How to create a database

(async () =>
< //.
const dbName =  'mydbname'
const storeName =  'store1'
const version =  1
//versions start at 1
const db =  await openDB(dbName, version, < upgrade(db, oldVersion, newVersion, transaction) <  const store = db.createObjectStore(storeName) > >) >)()

Першими 2-ма параметрами є name database, і the verson. Third param, which is optional, is object that contains a function Called only if the version number is higher than the current installed database version. У функції тіла ви можете розробити структуру (stores and indexes) of the db.

Adding data into a store

Adding data when the store is created, initializing it

Ви використовуєте шлях методу object store, але в першу чергу необхідно повідомити про це, які ми можемо отримати від db.createObjectStore() when we create it.

Якщо ви використовуєте пункт , значення є першим argumentом, key is the second. write the value.

Це populates store0 як soon as we create it:

(async () =>
< //.
const dbName = 'mydbname'
const storeName = 'store0'
const version = 1
const db = await openDB(dbName, version,< upgrade(db, oldVersion, newVersion, transaction) < const store = db.createObjectStore(storeName) store.put('Hello world!', 'Hello') > >) >)()

Adding data when the store is already created, using transactions

Щоб отримати додаткові дані, щоб подолати дорожнечу, ви повинні створити read/write transaction, Що забезпечить database integrity (якщо функціонування нестачі, всі операції в трансакції є пов'язаний back and state goes back to a known state).

Для того, щоб скористатися посиланнями на dbPromise object we got when calling openDB , and run:

(async () =>
< //.
const dbName = 'mydbname'
const storeName = 'store0'
const version = 1
const db = await openDB(/* . */) const tx = db.transaction(storeName, 'readwrite') const store = await tx.objectStore(storeName) const val = 'hey!'
const key = 'Hello again'
const value = await store.put(val, key) await tx.done >)()

Getting data from a store

Getting one item from a store: get()

const key = 'Hello again'
const item = await db.transaction(storeName).objectStore(storeName).get(key)

Getting all the items from a store: getAll()

Get all the keys stored

const items = await db.transaction(storeName).objectStore(storeName).getAllKeys()

Get all the values stored

const items =  await db.transaction(storeName).objectStore(storeName).getAll()

Deleting data from IndexedDB

Deleting the database, an object store and data

Delete an entire IndexedDB database

const dbName =  'mydbname'
await deleteDB(dbName)

To delete data in an object store

We use a transaction:

(async () =>
< //.
const dbName =  'mydbname'
const storeName =  'store1'
const version =  1
const db =  await openDB(dbName, version, < upgrade(db, oldVersion, newVersion, transaction) <  const store = db.createObjectStore(storeName) > >)  const tx =  await db.transaction(storeName,  'readwrite') const store =  await tx.objectStore(storeName)  const key =  'Hello again'
await store.delete(key)  await tx.done >)()

Migrate from previous version of database

Third (optional) parameter of the openDB() function is an object that can contain an upgrade function Called only if the version number is higher than the current installed database version. У тому, що функції тіла ви можете розробити структуру (stores and indexes) of the db:

const name =  'mydbname'
const version =  1 openDB(name, version, < upgrade(db, oldVersion, newVersion, transaction) <  console.log(oldVersion) > >)

У цьому callback, ви можете виконати з якого version the user is updating, and perform some operations accordingly.

Ви можете виконувати migration від попередньої бази даних, використовуючи цю syntax

(async () =>
< //.
const dbName =  'mydbname'
const storeName =  'store0'
const version =  1
const db =  await openDB(dbName, version, < upgrade(db, oldVersion, newVersion, transaction) <  switch (oldVersion) <  case
0: // no db created before
// a store introduced in version 1 db.createObjectStore('store1') case
1: // a new store in version 2 db.createObjectStore('store2', < keyPath: 'name' >) > db.createObjectStore(storeName) > >) >)()

Unique keys

createObjectStore() як ви можете повідомити в разі 1 налаштування на другий параметр, що вказує на index key of database. (an object) and the key will be mapped to the object property that has that name.

Index дає вам можливість відновити значення часу, що конкретний key, і він повинен бути unique (кожний елемент повинен мати різний key)

Натисніть кнопку, щоб встановити на auto increment, якщо ви не потрібні, щоб керувати ним на сайті клієнта коду:

db.createObjectStore('notes', < autoIncrement: true >)

Використовуйте автоматичне збільшення, якщо ваші значення не містять жодного key already (для прикладу, якщо ви отримуєте адреси електронної пошти без назви ім'я).

Check if a store exists

Ви можете виконати, якщо object store already exists by calling the objectStoreNames() method:

const storeName = 'store1'
if (!db.objectStoreNames.contains(storeName))

Deleting from IndexedDB

Deleting the database, an object store and data

Delete a database

Delete an object store

На object store може тільки бути вилучений в callback коли opening a db, і те, що callback є тільки здійснено, якщо ви робите версію високу, ніж один currently installed:

const db = await openDB('dogsdb', 2, < upgrade(db, oldVersion, newVersion, transaction) < switch (oldVersion) < case
0: // no db created before
// a store introduced in version 1 db.createObjectStore('store1') case
1: // delete the old store in version 2, create a new one db.deleteObjectStore('store1') db.createObjectStore('store2') > > >)

To delete data in an object store use a transaction

const key = 232
//a random key
const db = await openDB(/*. */) const tx = await db.transaction('store', 'readwrite') const store = await tx.objectStore('store') await store.delete(key) await tx.complete

There's more!

Вони є тільки основами.Там більше, ніж IndexedDB, але я хотів, щоб зробити це head start.

Interested in learning JavaScript? Get my JavaScript book at jshandbook.com

Якщо ви збираєтеся це far, тому що автор до show them you care. Say Thanks

Learn to code for free. freeCodeCamp's open source curriculum has helped more than 40,000 people get jobs as developers. Get started

freeCodeCamp є донор-підтриманим tax-exempt 501(c)(3) charity organization (United States Federal Tax Identification Number: 82-0779546)

Наша місія: для людей, які беруть участь у коді для безкоштовного. Використовуйте це, створюючи тисячі відеозаписів, статей, і interactive coding lessons - всі доступні для громадськості.

Додатки до безкоштовногокодуКомп до нашої освіти ініціативи, і доступні плати для серверів, послуг, і staff.