Rumah >hujung hadapan web >tutorial js >Penggunaan Dexie, pembalut IndexedDB, dalam Lobechat
Dalam artikel ini, kami menganalisis penggunaan Dexie dalam Lobechat.
Jika anda menyemak [folder pangkalan data dalam lobechat, ia mempunyai 2 folder:
pelanggan
pelayan
Dalam dokumen hos sendiri Lobechat ini, disebutkan bahawa LobeChat
lalai menggunakan pangkalan data sisi klien (IndexedDB). Itulah sebabnya anda mempunyai dua folder, satu untuk pelanggan dan satu untuk pelayan.
pangkalan data/klien/teras/db.ts mengimport Dexie.
Dexie ialah pembalut minimalis untuk indexedDB. Mari lihat contoh dexie mudah yang disediakan dalam tutorial Bermula.
// db.ts import Dexie, { type EntityTable } from 'dexie'; interface Friend { id: number; name: string; age: number; } const db = new Dexie('FriendsDatabase') as Dexie & { friends: EntityTable< Friend, 'id' // primary key "id" (for the typings only) >; }; // Schema declaration: db.version(1).stores({ friends: '++id, name, age' // primary key "id" (for the runtime!) }); export type { Friend }; export { db };
Aplikasi biasanya mempunyai satu contoh Dexie yang diisytiharkan sebagai modulnya sendiri. Di sinilah anda mengisytiharkan jadual yang anda perlukan dan cara setiap jadual akan diindeks. Contoh Dexie ialah singleton sepanjang
aplikasi — anda tidak perlu menciptanya atas permintaan. Eksport contoh db yang terhasil daripada modul anda supaya komponen atau modul lain boleh menggunakannya untuk membuat pertanyaan atau menulis ke pangkalan data.
Menggunakan baris ini yang ditunjukkan di bawah, Lobechat mencipta contoh tunggal BrowserDB.
export class BrowserDB extends Dexie { public files: BrowserDBTable<'files'>; public sessions: BrowserDBTable<'sessions'>; public messages: BrowserDBTable<'messages'>; public topics: BrowserDBTable<'topics'>; public plugins: BrowserDBTable<'plugins'>; public sessionGroups: BrowserDBTable<'sessionGroups'>; public users: BrowserDBTable<'users'>; constructor() { this.version(1).stores(dbSchemaV1); this.version(2).stores(dbSchemaV2); this.version(3).stores(dbSchemaV3); this.version(4) .stores(dbSchemaV4) .upgrade((trans) => this.upgradeToV4(trans)); // … more code export const browserDB = new BrowserDB();
versi yang ditulis dalam pembina menunjukkan cara skema pangkalan data sisi klien berkembang dari semasa ke semasa, Baca lebih lanjut tentang Dexie.version() untuk memahami versi.
Di Thinkthroo, kami mengkaji projek sumber terbuka yang besar dan menyediakan panduan seni bina. Kami telah membangunkan Komponen resubale, dibina dengan tailwind, yang boleh anda gunakan dalam projek anda. Kami menawarkan perkhidmatan pembangunan Next.js, React dan Node.
Tempah mesyuarat dengan kami untuk membincangkan projek anda.
https://github.com/lobehub/lobe-chat/blob/main/src/database/client/core/db.ts
https://dexie.org/
https://developer.mozilla.org/en-US/docs/Web/API/IndexedDB_API/Using_IndexedDB
https://web.dev/articles/indexeddb
https://lobehub.com/docs/self-hosting/server-database
https://dexie.org/docs/Tutorial/React
Atas ialah kandungan terperinci Penggunaan Dexie, pembalut IndexedDB, dalam Lobechat. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!