When you work with a phonegap application, sometimes you need develop a work-offline mode for your app. In this case, SQLite is a good choice. You can use SQLite to store data you loaded from server-side. If your device lost internet connection, application will load data from SQLite firstly.
Common sense is not a gift, It’s a punishment. Because you have to deal with everyone who doesn’t have it.
To implement, you need install SQLite phonegap plugin for your app. And then, you write a service to handle get/set/remove data in SQLite. And now, I will show you a script that run in my app that uses angularjs, coffee script.
The below is coffee script that implement a factory to get/set/remove cache to SQLite
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 |
app.factory 'dbcache', ($q)-> factory = getItem: (table, key)-> deferred = $q.defer() db = window.sqlitePlugin.openDatabase({name: "app_dbcache"}) db.transaction (tx) -> tx.executeSql 'create table if not exists ' + table + ' (id integer primary key, key text, data text)' tx.executeSql "select data from " + table + " where key='" + key + "';", [], (tx, res)-> if res.rows.length > 0 deferred.resolve(res.rows.item(0).data) else deferred.resolve(false) return deferred.promise setItem: (table, key, data)-> db = window.sqlitePlugin.openDatabase({name: "app_dbcache"}) db.transaction (tx) -> tx.executeSql 'create table if not exists ' + table + ' (id integer primary key, key text, data text)' tx.executeSql "select data from " + table + " where key='" + key + "';", [], (tx, res)-> if (res.rows.length > 0) tx.executeSql "UPDATE " + table + " SET data = '" + data + "' WHERE key ='" + key + "'", [], (tx, res) -> return true else tx.executeSql "INSERT INTO " + table + " (key, data) VALUES (?,?)", [key, data], (tx, res) -> return true return false removeItem: (table, key)-> db = window.sqlitePlugin.openDatabase({name: "app_dbcache"}) db.transaction (tx) -> tx.executeSql "DELETE FROM " + table + " WHERE key = '" + key + "';", [], (tx, res) -> return true return false removeAll: (table)-> db = window.sqlitePlugin.openDatabase({name: "app_dbcache"}) db.transaction (tx) -> tx.executeSql "DROP TABLE " + table, [], (tx, res) -> return true return false |
And DbCache factory should be injected to factories used to load data. The below is my way:
– Load from SQLite cache firstly
– If Cache is empty, use $http to load data from server-side
Code example:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 |
app.factory 'post_data', [ '$http' '$q' 'dbcache' ($http, $q, dbcache)-> factory = load: (post_id)-> deferred = $q.defer() # get data from sqlite cache dbcache.getItem('post_data', 'load'+post_id).then (data)-> if data deferred.resolve(jQuery.parseJSON(data)) else $http.get [url_to_server_api] .success (data2)-> # save data into sqlite cache dbcache.setItem('post_data', 'load'+post_id, JSON.stringify(data2)) deferred.resolve(data2) .error (msg)-> # should call alert message here deferred.resolve(false) return deferred.promise ] |
