Hay varias API de almacenamiento disponibles para las aplicaciones de Cordova. Ver html5rocks descripción general del almacenamiento y tutorial, para obtener una descripción más completa y ejemplos.
Cada API ofrece ventajas y desventajas, que se resumen aquí. Debe elegir el que mejor se adapte a sus necesidades. También puede utilizar varios enfoques diferentes dentro de una sola aplicación para diferentes propósitos.
Almacenamiento local
El almacenamiento local proporciona key/ valor de almacenamiento de pares, y es compatible con las implementaciones subyacentes de WebView en todas las plataformas Cordova.
Resumen de uso
Se puede acceder al almacenamiento local a través de window.localStorage
. El siguiente fragmento de código muestra los métodos más importantes expuestos por el Storage
objeto:
var storage = window.localStorage;var value = storage.getItem(key);// Pass a key name to get its value. storage.setItem(key, value)// Pass a key name and its value to add or update that key. storage.removeItem(key)// Pass a key name to remove that key from storage.
Para más información, ver:
Ventajas
- Compatible con todas las plataformas de Cordova.
- Su API simple y sincrónica significa que es fácil de usar.
Desventajas
- Solo almacena cadenas, por lo que las estructuras de datos complejas deben serializarse y solo se pueden almacenar los datos que se pueden serializar.
- Funciona mal con grandes cantidades de datos. En particular:
- La falta de indexación significa que las búsquedas requieren iterar manualmente todos los datos.
- El almacenamiento de elementos grandes o complejos es lento debido a la necesidad de serializar / deserializar.
- API síncrona significa que las llamadas bloquearán la interfaz de usuario.
- Cantidad total limitada de almacenamiento (normalmente alrededor de 5 MB).
- tiendas iOS
localStorage
datos en una ubicación que el sistema operativo pueda limpiar cuando se requiera espacio.
WebSQL
WebSQL proporciona una API para almacenar datos en una base de datos estructurada que se puede consultar utilizando una sintaxis SQL estándar (específicamente, SQLite). Como tal, proporciona toda la potencia (y complejidad) de SQL.
Es compatible con WebView subyacente en las siguientes plataformas de Cordova:
- Androide
- iOS
Resumen de uso
El punto de entrada para crear o abrir una base de datos es el window.openDatabase()
método:
var db = window.openDatabase(name, version, displayName, estimatedSize);
- nombre (string): El nombre único de la base de datos, ya que se almacenará en el disco.
- versión (string): La versión de la base de datos.
- nombre para mostrar (string): Un nombre amigable para humanos para la base de datos, que el sistema usará si necesita describir su base de datos al usuario (por ejemplo, al solicitar permiso para aumentar el tamaño de la base de datos).
- EstimatedSize (número): el tamaño máximo esperado de la base de datos, en bytes. A medida que la base de datos aumenta de tamaño, es posible que se solicite permiso al usuario. Si realiza una primera conjetura razonable, es probable que se le pregunte al usuario con menos frecuencia.
El retorno Database
El objeto proporciona un transaction()
método (o readTransaction()
para optimizar las transacciones de solo lectura) que le permite crear una transacción a prueba de fallas:
var db = window.openDatabase(name, version, displayName, estimatedSize); db.transaction(function(tx) tx.executeSql(sqlStatement, valueArray,function(tx, result) console.log(result);,function(error) console.log(error);););
Para más información, ver:
Para obtener una buena introducción al lenguaje SQL, consulte:
Trabajar con versiones de bases de datos
Al abrir una base de datos existente, si la versión especificada no coincide con la versión de la base de datos, se lanzará una excepción y la base de datos no se abrirá. Sin embargo, si especifica un vacío string para la versión, la base de datos se abrirá independientemente de su versión actual (y puede consultar la versión actual a través de db.version
). Sin embargo, tenga cuidado: si se está creando la base de datos, se creará con su versión configurada en un vacío string.
Ventajas
- Buen rendimiento: los datos se pueden indexar para proporcionar búsquedas rápidas y la API asíncrona significa que no bloquea la interfaz de usuario.
- Robustez por el uso de un modelo de base de datos transaccional.
- Soporte para control de versiones.
Desventajas
- No es compatible con todas las plataformas de Cordova.
- Más complejo para trabajar que Almacenamiento local o IndexedDB.
- La API está obsoleta. Es poco probable que alguna vez sea compatible con plataformas que actualmente no lo admiten, y es posible que se elimine de las plataformas que sí lo son.
- Impone una estructura rígida que debe definirse de antemano.
- Cantidad total limitada de almacenamiento (normalmente alrededor de 5 MB).
IndexedDB
El objetivo de la API IndexedDB es combinar las fortalezas de las API LocalStorage y WebSQL, evitando al mismo tiempo sus debilidades. IndexedDB le permite almacenar objetos JavaScript arbitrarios (siempre que sean compatibles con el algoritmo de clon estructurado), indexado con un key. Proporciona algunos de los beneficios de las tablas SQL, sin restringir la estructura ni tener que definirla por adelantado.
IndexedDB proporciona un modelo de datos simple y fácil de entender, muy parecido a LocalStorage. Pero a diferencia de LocalStorage, puede crear varias bases de datos, con varias tiendas por base de datos, y su API asincrónica y sus índices de búsqueda proporcionan beneficios de rendimiento.
IndexedDB es compatible con WebView subyacente en las siguientes plataformas de Cordova:
- Windows (con algunas limitaciones)
- Android (4.4 y superior)
Limitaciones de Windows
El soporte de la plataforma Windows para IndexedDB es incompleto. Por ejemplo, carece de las siguientes características:
- No disponible en trabajadores web.
- No es compatible array keyPaths.
- No es compatible array keys.
- No es compatible con la búsqueda de objetos a través de un índice compuesto.
Resumen de uso
- IndexedDB funciona de forma asincrónica: solicita una operación de base de datos en particular y luego recibe una notificación del resultado a través de un evento DOM.
- Cuando realiza una solicitud, obtiene un objeto de solicitud, que proporciona
onerror
yonsuccess
eventos, así como propiedades comoresult
,error
yreadyState
.
El siguiente fragmento de código demuestra un uso simple de IndexedDB:
var db;var databaseName ='myDB';var databaseVersion =1;var openRequest = window.indexedDB.open(databaseName, databaseVersion); openRequest.onerror=function(event) console.log(openRequest.errorCode);; openRequest.onsuccess=function(event)// Database is open and initialized - we're good to proceed. db = openRequest.result;displayData();; openRequest.onupgradeneeded=function(event)// This is either a newly created database, or a new version number// has been submitted to the open() call.var db = event.target.result; db.onerror=function() console.log(db.errorCode);;// Create an object store and indexes. A key is a data value used to organize// and retrieve values in the object store. The keyPath option identifies where// the key is stored. If a key path is specified, the store can only contain// JavaScript objects, and each object stored must have a property with the// same name as the key path (unless the autoIncrement option is true).var store = db.createObjectStore('customers', keyPath:'customerId');// Define the indexes we want to use. Objects we add to the store don't need// to contain these properties, but they will only appear in the specified// index of they do.//// syntax: store.createIndex(indexName, keyPath[, parameters]);//// All these values could have duplicates, so set unique to false store.createIndex('firstName','firstName', unique:false); store.createIndex('lastName','lastName', unique:false); store.createIndex('street','street', unique:false); store.createIndex('city','city', unique:false); store.createIndex('zipCode','zipCode', unique:false); store.createIndex('country','country', unique:false);// Once the store is created, populate it store.transaction.oncomplete=function(event)// The transaction method takes an array of the names of object stores// and indexes that will be in the scope of the transaction (or a single// string to access a single object store). The transaction will be// read-only unless the optional 'readwrite' parameter is specified.// It returns a transaction object, which provides an objectStore method// to access one of the object stores that are in the scope of this//transaction.var customerStore = db.transaction('customers','readwrite').objectStore('customers'); customers.forEach(function(customer) customerStore.add(customer););;;functiondisplayData()
Para más información, ver:
- W3C: Especificaciones
- MDN: Referencia de API IndexedDB
- MDN: Conceptos básicos de IndexedDB
- MDN: uso de la guía IndexedDB
Ventajas
- Buen rendimiento: la API asincrónica no bloquea la interfaz de usuario y la indexación proporciona un buen rendimiento de búsqueda.
- Modelo de datos simple más fácil de aprender que SQL.
- Estructura más flexible que WebSQL.
- Varias bases de datos y almacenes de objetos proporcionan más estructura que LocalStorage.
- Robustez por el uso de un modelo de base de datos transaccional.
- Soporte para control de versiones.
Desventajas
- No es compatible con iOS.
- API compleja con devoluciones de llamada anidadas.
- Cantidad total limitada de almacenamiento (normalmente alrededor de 5 MB).
Opciones basadas en complementos
API del sistema de archivos
La API de FileSystem era una especificación de W3C que fue implementada por Chrome, pero no por otros navegadores. Proporciona API para almacenar y recuperar datos en el sistema de archivos local, y se describe con cierto detalle en un excelente artículo de html5rocks. Si bien la API no es compatible de forma nativa con ninguna plataforma de Cordova, la Complemento de archivo proporciona una implementación extensa que está disponible en todas las plataformas de Cordova.
Complemento SQLite
El complemento SQLite proporciona una API prácticamente idéntica a WebSQL descrita anteriormente. Las principales diferencias son:
- Está disponible con soporte para la plataforma Windows.
- Efectivamente, no tiene limitaciones de tamaño.
Está disponible en las siguientes variaciones:
- cordova-sqlite-storage – versión core que incluye su propia implementación sqlite3. Es compatible con las plataformas iOS, Android y Windows.
- cordova-sqlite-ext – versión extendida con características adicionales que incluyen soporte REGEXP en Android e iOS.
- cordova-sqlite-evfree – Similar a cordova-sqlite-ext pero con un manejo de memoria mejorado. Disponible bajo GPL v3 o licencia comercial.
Otros complementos
Buscar Complementos de Cordova para otros complementos que brindan opciones de almacenamiento alternativas.
Si te ha resultado de ayuda nuestro artículo, sería de mucha ayuda si lo compartes con el resto juniors de este modo nos ayudas a dar difusión a esta información.