Skip to main content
Recompensa finalizada con 250 de reputación otorgada por Alvaro Montoro
mayores detalles incluidos
Origen Enlace
fredyfx
  • 13.2k
  • 11
  • 33
  • 65

Pequeño tutorial sobre un CRUD:

Creamos o abrimos un DB:

var myDB = window.sqlitePlugin.openDatabase({name: "mySQLite.db", location: 'default'});

myDB.transaction(function(transaction) {
transaction.executeSql('CREATE TABLE IF NOT EXISTS phonegap_pro (id integer primary key, title text, desc text)', [],
function(tx, result) {
    alert("Table created successfully");
},
function(error) {
alert("Error occurred while creating the table.");
    });
});

Insertando data:

var title="Fredy Guibert";
var desc="Full Stack Web Developer";
myDB.transaction(function(transaction) {
var executeQuery = "INSERT INTO phonegap_pro (title, desc) VALUES (?,?)";
transaction.executeSql(executeQuery, [title,desc]
, function(tx, result) {
    alert('Inserted');
},
function(error){
    alert('Error occurred');
});
});

Select

myDB.transaction(function(transaction) {
transaction.executeSql('SELECT * FROM phonegap_pro', [], function (tx, results) {
var len = results.rows.length, i;
$("#rowCount").append(len);
for (i = 0; i < len; i++){
$("#TableData").append("<tr><td>"+results.rows.item(i).id+"</td><td>"+results.rows.item(i).title+"</td><td>"+results.rows.item(i).desc+"</td></tr>");
}
}, null);
});

Update

$("#update").click(function(){
 var id=$("#id").text();
 var title=$("#title").val();
 var desc=$("#desc").val()
 myDB.transaction(function(transaction) {
 var executeQuery = "UPDATE phonegap_pro SET title=?, desc=? WHERE id=?";
 transaction.executeSql(executeQuery, [title,desc,id],
 //On Success
 function(tx, result) {alert('Updated successfully');},
 //On Error
 function(error){alert('Something went Wrong');});
 });
});

Delete

myDB.transaction(function(transaction) {
 var executeQuery = "DELETE FROM phonegap_pro where id=?";
 transaction.executeSql(executeQuery, [id],
 //On Success
 function(tx, result) {alert('Delete successfully');},
 //On Error
 function(error){alert('Something went Wrong');});
 });

Eliminar la tabla:

myDB.transaction(function(transaction) {
 var executeQuery = "DROP TABLE IF EXISTS phonegap_pro";
 transaction.executeSql(executeQuery, [],
 function(tx, result) {alert('Table deleted successfully.');},
 function(error){alert('Error occurred while droping the table.');}
 );
 });

Referencia: https://phonegappro.com/tutorials/phonegap-sqlite-tutorial-with-example-apache-cordova/

Si estás utilizando ionic, este tuto te va a gustar: https://www.thepolyglotdeveloper.com/2015/12/use-sqlite-in-ionic-2-instead-of-local-storage/ y su respectivo video explicando detalle a detalle: https://www.youtube.com/watch?v=F6TUtN0VYwY

Pequeño tutorial sobre un CRUD:

Creamos o abrimos un DB:

var myDB = window.sqlitePlugin.openDatabase({name: "mySQLite.db", location: 'default'});

myDB.transaction(function(transaction) {
transaction.executeSql('CREATE TABLE IF NOT EXISTS phonegap_pro (id integer primary key, title text, desc text)', [],
function(tx, result) {
    alert("Table created successfully");
},
function(error) {
alert("Error occurred while creating the table.");
    });
});

Insertando data:

var title="Fredy Guibert";
var desc="Full Stack Web Developer";
myDB.transaction(function(transaction) {
var executeQuery = "INSERT INTO phonegap_pro (title, desc) VALUES (?,?)";
transaction.executeSql(executeQuery, [title,desc]
, function(tx, result) {
    alert('Inserted');
},
function(error){
    alert('Error occurred');
});
});

Select

myDB.transaction(function(transaction) {
transaction.executeSql('SELECT * FROM phonegap_pro', [], function (tx, results) {
var len = results.rows.length, i;
$("#rowCount").append(len);
for (i = 0; i < len; i++){
$("#TableData").append("<tr><td>"+results.rows.item(i).id+"</td><td>"+results.rows.item(i).title+"</td><td>"+results.rows.item(i).desc+"</td></tr>");
}
}, null);
});

Update

$("#update").click(function(){
 var id=$("#id").text();
 var title=$("#title").val();
 var desc=$("#desc").val()
 myDB.transaction(function(transaction) {
 var executeQuery = "UPDATE phonegap_pro SET title=?, desc=? WHERE id=?";
 transaction.executeSql(executeQuery, [title,desc,id],
 //On Success
 function(tx, result) {alert('Updated successfully');},
 //On Error
 function(error){alert('Something went Wrong');});
 });
});

Delete

myDB.transaction(function(transaction) {
 var executeQuery = "DELETE FROM phonegap_pro where id=?";
 transaction.executeSql(executeQuery, [id],
 //On Success
 function(tx, result) {alert('Delete successfully');},
 //On Error
 function(error){alert('Something went Wrong');});
 });

Eliminar la tabla:

myDB.transaction(function(transaction) {
 var executeQuery = "DROP TABLE IF EXISTS phonegap_pro";
 transaction.executeSql(executeQuery, [],
 function(tx, result) {alert('Table deleted successfully.');},
 function(error){alert('Error occurred while droping the table.');}
 );
 });

Referencia: https://phonegappro.com/tutorials/phonegap-sqlite-tutorial-with-example-apache-cordova/

Si estás utilizando ionic, este tuto te va a gustar: https://www.thepolyglotdeveloper.com/2015/12/use-sqlite-in-ionic-2-instead-of-local-storage/ y su respectivo video explicando detalle a detalle: https://www.youtube.com/watch?v=F6TUtN0VYwY

Origen Enlace
fredyfx
  • 13.2k
  • 11
  • 33
  • 65

Y de las restantes, WebSQL y SQLite:

¿Cuáles son las ventajas e inconvenientes de cada una de ellas?

WebSQL:

"This document was on the W3C Recommendation track but specification work has stopped. The specification reached an impasse: all interested implementors have used the same SQL backend (Sqlite), but we need multiple independent implementations to proceed along a standardisation path."

En español:

"Este documento estaba en la pista Recomendación W3C, pero el trabajo de especificación se ha detenido. La especificación llegó a un callejón sin salida: todos los implementadores interesados han utilizado el mismo servidor SQL (SQLite), pero necesitamos múltiples implementaciones independientes para proceder a lo largo de una trayectoria de normalización."

  • A pesar que hay soporte en iOS, ni Microsoft, ni Mozilla le han dado soporte hasta la fecha, referencia: http://caniuse.com/#search=websql

  • Tiene mucho parecido a la sintaxis tradicional de SQL que estamos acostumbrados.

  • Es relativamente nuevo, poca documentación en la red en comparación a SQLite

Script:

      <script type="text/javascript">
        
         var db = openDatabase('mydb', '1.0', 'Test DB', 2 * 1024 * 1024);
         var msg;
            
         db.transaction(function (tx) {
            tx.executeSql('CREATE TABLE IF NOT EXISTS LOGS (id unique, log)');
            tx.executeSql('INSERT INTO LOGS (id, log) VALUES (1, "foobar")');
            tx.executeSql('INSERT INTO LOGS (id, log) VALUES (2, "logmsg")');
            msg = '<p>Log message created and row inserted.</p>';
            document.querySelector('#status').innerHTML =  msg;
         });

         db.transaction(function (tx) {
            tx.executeSql('SELECT * FROM LOGS', [], function (tx, results) {
               var len = results.rows.length, i;
               msg = "<p>Found rows: " + len + "</p>";
               document.querySelector('#status').innerHTML +=  msg;
                    
               for (i = 0; i < len; i++){
                  msg = "<p><b>" + results.rows.item(i).log + "</b></p>";
                  document.querySelector('#status').innerHTML +=  msg;
               }
            }, null);
         });
            
      </script>

HTML:

<div id="status" name="status">Status Message</div>

Referencia del ejemplo mostrado: http://www.tutorialspoint.com/html5/html5_web_sql.htm

SQLite:

Tiene bastante soporte, desde su lanzamiento en el 2000, hay cientos de sitios que te dan soporte, ejemplos, documentación, etc, etc, etc. Lo encuentran en:

Android7 5
BlackBerry
Windows Phone 8
Google Chrome5
iOS5
Firefox OS
Maemo
MeeGo
Symbian OS5
webOS

Referencia: San Wikipedia https://es.wikipedia.org/wiki/SQLite

¿Hay alguna ventaja/inconveniente de usar una sobre la otra?

La principal ventaja es que al utilizar SQLite tienes la madurez necesaria de la experiencia global de desarrolladores que han realizado soluciones con dicha plataforma.

¿Existen problemas de integración con alguna de esas plataformas?

Sí, con WebSQL: El espacio límite de almacenamiento está definido por el navegador, http://www.html5rocks.com/en/tutorials/offline/quota-research/

Para aprender y manejar SQLite, te recomiendo visitar http://www.tutorialspoint.com/sqlite/index.htm

Con respecto a Apache Cordova

SQLite Plugin Tiene 3 variantes:

  • cordova-sqlite-storage - es la versión core que incluye la implementación de sqlite3. Soporta iOS, Android & Windows platforms.
  • cordova-sqlite-ext - versión extendida que incluye REGEXP, soportado en Android and iOS.
  • cordova-sqlite-evfree - similar cordova-sqlite-ext pero con mejor manejo de memoria. Disponible con licencia Comercial o GPL v3.

Mayor información en: https://cordova.apache.org/docs/en/latest/cordova/storage/storage.html#plugin-based-options-filesystem-api