要在PWA中使用数据库,可以遵循以下步骤:
在PWA中,可以选择使用浏览器原生支持的IndexedDB或Web SQL数据库,也可以使用第三方库,如PouchDB和Dexie等。
在应用程序中,可以使用以下代码创建数据库:
// IndexedDB
let request = indexedDB.open('mydb', 1);
request.onerror = function(event) {
console.log('数据库打开失败');
};
request.onsuccess = function(event) {
let db = event.target.result;
console.log('数据库打开成功');
};
// Web SQL
let db = window.openDatabase('mydb', '1.0', 'My database', 2 * 1024 * 1024);
console.log('数据库已创建');
这段代码会创建一个名为“mydb”的数据库,并打开它。
在数据库中,可以创建一个或多个对象存储空间,用于存储数据。可以使用以下代码创建对象存储空间:
// IndexedDB
let request = indexedDB.open('mydb', 1);
request.onupgradeneeded = function(event) {
let db = event.target.result;
let store = db.createObjectStore('mystore', { keyPath: 'id' });
console.log('对象存储空间已创建');
};
// Web SQL
let db = window.openDatabase('mydb', '1.0', 'My database', 2 * 1024 * 1024);
db.transaction(function(tx) {
tx.executeSql('CREATE TABLE IF NOT EXISTS mystore (id unique, data)');
console.log('对象存储空间已创建');
});
这段代码会在数据库中创建一个名为“mystore”的对象存储空间。
在应用程序中,可以使用以下代码存储数据:
// IndexedDB
let request = indexedDB.open('mydb', 1);
request.onsuccess = function(event) {
let db = event.target.result;
let tx = db.transaction('mystore', 'readwrite');
let store = tx.objectStore('mystore');
let data = { id: 1, name: 'John' };
store.add(data);
console.log('数据已存储');
};
// Web SQL
let db = window.openDatabase('mydb', '1.0', 'My database', 2 * 1024 * 1024);
db.transaction(function(tx) {
tx.executeSql('INSERT INTO mystore (id, data) VALUES (?, ?)', [1, 'John']);
console.log('数据已存储');
});
这段代码会将一个名为“John”的数据存储到“mystore”对象存储空间中。
在应用程序中,可以使用以下代码检索数据:
// IndexedDB
let request = indexedDB.open('mydb', 1);
request.onsuccess = function(event) {
let db = event.target.result;
let tx = db.transaction('mystore', 'readonly');
let store = tx.objectStore('mystore');
let request = store.get(1);
request.onsuccess = function(event) {
let data = event.target.result;
console.log(data);
};
};
// Web SQL
let db = window.openDatabase('mydb', '1.0', 'My database', 2 * 1024 * 1024);
db.transaction(function(tx