Ionic Sqlite and crhome webrowser for test app

Ionic Framework ionic-v3
1

How i can using sqlite with ionic2 and using chrome for test my app?
don’t make this https://www.thepolyglotdeveloper.com/2015/12/use-sqlite-in-ionic-2-instead-of-local-storage/
Thanks advanced!

2

I am also interested in this topic.
If someone has CRUD (lists, forms, search) demo with SQLite database.

3

You cannot test SQLite storage in chrome since it is using Cordova SQLite plugin. You can test in emulator or test via mobile in debug mode.

1 Like
4

you could try using something like this

5

I will tried!, thanks!

6

I finally made it. This works.
In “providers” add this

constructor(platform: Platform) {
platform.ready().then(() => {
if (platform._platforms[0] == ‘cordova’) {
this.db = win.sqlitePlugin.openDatabase({ name: DB_NAME , location:“default”});
} else {
this.db = win.openDatabase(DB_NAME, “1”, “dbf1”, 1024 * 1024 * 100);
}
this.create_TBL();
});
}

7

Please post code complete!!!
Thanks!

8

hi.

Can you please post the complete code? it should be this.platform.ready()… right?

9

Here is my database providers and this is all explained
https://github.com/driftyco/ionic/issues/8269
and
https://gist.github.com/NickStemerdink/64c782807fc31b7bc9b529ad4b1d56d5

Open debug Chrome Application-> Web SQL and your database is here.
But I’m stuck here. I can not get list rows on another page
In emulator everything works.

/** database.ts **/
import { Injectable } from ‘@angular/core’;
import { Platform } from ‘ionic-angular’;

const DB_NAME: string = ‘dbf1.db’;
const win: any = window;

@Injectable()
export class Database {
private db: any;
vdknj_nzv: any;
constructor(platform: Platform) {
platform.ready().then(() => {

  if (platform._platforms[0] == 'cordova') {
        this.db = win.sqlitePlugin.openDatabase({ name: DB_NAME , location:"default"});
    } else {
        this.db = win.openDatabase(DB_NAME, "1", "dbf1", 1024 * 1024 * 100);
    }   
        this.create_TBL();			
        this.ins_TBL();			
   });

}

create_TBL() {
this.query(‘CREATE TABLE IF NOT EXISTS def (id INTEGER NOT NULL PRIMARY KEY AUTOINCREMENT UNIQUE, usr TEXT UNIQUE, psw TEXT ,lnk TEXT,tip TEXT, vdknj_id INTEGER,instm TEXT, insusr TEXT, updtm TEXT, updusr TEXT,exptm TEXT, expusr TEXT)’).catch(err => {
console.error(‘Storage: Unable to create initial storage tables’, err.tx, err.err); });
}

ins_TBL = function () {

  this.query("INSERT INTO def (id,usr,psw,lnk,tip,v_id,instm,insusr,updtm,updusr,exptm,expusr)  VALUES (1,'admin','12345','-','-',1,'-','admin',' ','admin',NULL,NULL);");

}

query(query: string, params: any[] = []): Promise {
return new Promise((resolve, reject) => {
try {
this.db.transaction((tx: any) => {
tx.executeSql(query, params,
(tx: any, res: any) => resolve({ tx: tx, res: res }),
(tx: any, err: any) => reject({ tx: tx, err: err }));
},
(err: any) => reject({ err: err }));
} catch (err) {
reject({ err: err });
}
});
}
/**
* Get the value in the database identified by the given key.
* @param {string} key the key
* @return {Promise} that resolves or rejects with an object of the form { tx: Transaction, res: Result (or err)}
*/
get(key: string): Promise {
return this.query(‘select key, value from kv where key = ? limit 1’, [key]).then(data => {
if (data.res.rows.length > 0) {
return data.res.rows.item(0).value;
}
});
}

/**
 * Set the value in the database for the given key. Existing values will be overwritten.
 * @param {string} key the key
 * @param {string} value The value (as a string)
 * @return {Promise} that resolves or rejects with an object of the form { tx: Transaction, res: Result (or err)}
 */
set(key: string, value: string): Promise<any> {
    return this.query('insert or replace into kv(key, value) values (?, ?)', [key, value]);
}

/**
 * Remove the value in the database for the given key.
 * @param {string} key the key
 * @return {Promise} that resolves or rejects with an object of the form { tx: Transaction, res: Result (or err)}
 */
remove(key: string): Promise<any> {
    return this.query('delete from kv where key = ?', [key]);
}

/**
 * Clear all keys/values of your database.
 * @return {Promise} that resolves or rejects with an object of the form { tx: Transaction, res: Result (or err)}
 */
clear(): Promise<any> {
    return this.query('delete from kv');
}

}

10

Now works and lists.:slight_smile:
I used the Ripple emulator in Chrome.
That was wrong.

11