Mis apuntes de desarrollo web </>

API IndexedDB

IndexedDB es una API de bajo nivel que ofrece almacenamiento en el cliente de cantidades significativas de datos estructurados, incluyendo archivos y blobs. Para búsquedas de alto rendimiento en esos datos usa índices. Mientras DOM Storage es útil para el almacenamiento de pequeñas cantidades de datos, no es útil para almacenar grandes cantidades de datos estructurados. IndexedDB proporciona una solución.

• Es una base de datos indexada y es una manera persistente de almacenar datos en el navegador.
• Almecena pares clave-valor. Los valores pueden ser objetos con estructuras complejas y las claves pueden ser propiedades de esos objetos.
• Es mayormente asíncrona.
• Usa eventos DOM para notificar cuando los resultados están disponibles.
• Es orientada a objetos.

Creación:

1. Crear la base de datos a través del objeto IndexedDB y el método open().
2. Comprobar si la base de datos existe o tiene que ser creada a través del método onupgradeneed().
3. Crear colección de objetos con el método createObjectStore().
   1. Se debe crear una Key para posteriormente poder añadir registros. Esto se puede mediante autoincrement: True o por medio de KeyPath.
4. Escuchar los eventos de éxito y de error con los métodos onsucces() y onerror().

Primer creación:

Ajuste con la creación de la Key:

Añadir datos:

1. Crear una transacción en la bd mediante el método transaction(['colección'], 'metodo'). Sus parámetros son: la coleccion de datos donde se añadira el registro y el método 'readwrite'.
2. Realizar la transacción mediante el método objectStore('colección').
3. Añadir el registro mediante el método add().

Leer datos:

1. Crear una transacción en la bd mediante el método transaction(['colección'], 'metodo'). Sus parámetros son: la coleccion de datos que se quieren leer y el método 'readonly'.
2. Realizar la transacción mediante el método objectStore('colección').
3. Crear un cursor (recorre cada uno de los objetos en la colección y devuelve el valor) mediante el método openCursor().
   1. Inicalmente el cursor solo lee el primer registro, por lo que mediante un onsucces() del request se ajusta el cursor para leer todos los registros mediante el metodo continue().

Actualizar datos:

1. Se recupera el registro que se quiere actualizar mediante su key.
2. Crear una transacción en la bd mediante el método transaction(['colección'], 'metodo'). Sus parámetros son: la coleccion de datos donde se añadira el registro y el método 'readwrite'.
3. Realizar la transacción mediante el método objectStore('colección').
4. Actualizar el registro mediante el método put().

Eliminar datos:

1. Crear una transacción en la bd mediante el método transaction(['colección'], 'metodo'). Sus parámetros son: la coleccion de datos donde se añadira el registro y el método 'readwrite'.
2. Realizar la transacción mediante el método objectStore('colección').
3. Eliminar el registro mediante el método delete().

Ejemplo:

Otros métodos:

getAll():

Obtener todos los registros de la base de datos.

clear():

Borrar objetos de la colección.

deleteDatabase():

Borrar la base de datos.

onBlocked():

Bloquear bases de datos en los cambios de version.

Objeto IDBKeyRange:

Para búsquedas en la base de datos.

createIndex():

Para la creación de índices en la base de datos.