This example project will show you how to use SQLite locally in your browser.
- https://developer.mozilla.org/en-US/docs/Web/API/File_System_API/Origin_private_file_system
- https://sqlite.org/wasm/doc/trunk/persistence.md#opfs
The Origin-Private FileSystem is a web API that provides a private file system for web applications. It is not visible to the user.
It is highly optimized for performance and offers in-place write access to its content.
It can be accessed from the main thread using Promise-based APIs.
Web workers can access it synchronously which makes it faster and doesn't block the main thread.
SQLite WASM requires a web worker to access the OPFS.
https://chromewebstore.google.com/detail/opfs-explorer/acndjpgkpaclldomagafnognkcgjignd?hl=en&pli=1
With this extension you can explore the OPFS in Chrome. It allows you to see the files and directories created by your web application.
https://sqlite.org/wasm/doc/trunk/persistence.md#coop-coep
In order to offer some level of transparent concurrent-db-access support, JavaScript's SharedArrayBuffer type is required for the OPFS VFS, and that class is only available if the web server includes the so-called COOP and COEP response headers when delivering scripts:
Cross-Origin-Embedder-Policy: require-corp
Cross-Origin-Opener-Policy: same-origin
Without these headers, the SharedArrayBuffer will not be available, so the OPFS VFS will not load. That class is required in order to coordinate communication between the synchronous and asynchronous parts of the sqlite3_vfs OPFS proxy.