I build a basic Ionic Vue app that queries a couple of documents from a Firebase Firestore and lists them. It is also possible to add new documents via the app.
The docs state that Firestore supports an offline mode:
Cloud Firestore supports offline data persistence. This feature caches a copy of the Cloud Firestore data that your app is actively using, so your app can access the data when the device is offline. You can write, read, listen to, and query the cached data. When the device comes back online, Cloud Firestore synchronizes any local changes made by your app to the Cloud Firestore backend.
I tried to enable this by using enablePersistance()
like this:
import firebase from 'firebase/compat/app';
import 'firebase/compat/auth';
import 'firebase/compat/firestore';
const firebaseConfig = {
// ...
};
const firebaseApp = firebase.initializeApp(firebaseConfig);
const db = firebaseApp.firestore();
db.enablePersistence();
export {db};
When I use the app on my phone, everything works as expected with an active internet connection.
I also works fine as long as I don't close the app:
- When I add an item without a connection, I see the change in the app, but not in my Firestore (of cause). When I go back online, the doc is also added to Firestore.
- When I delete a doc in the Firestore without a connection on my phone, nothing happens on the phone (of cause). When I go back online, the doc is also deleted on the phone.
However, when I close the app and open it without a connection, nothing is loaded and displayed. Only when I go online again, I see my Firebase docs.
What I expected/hoped was that the docs are saved locally so that I can access them even without a connection and also after closing the app. Is this how it is supposed to be? If so, what am I doing wrong?
Thanks a lot!