I'm new to Firebase and I found getDocsFromCache. I heard that firebase updated it's version to version 9, (modular) and i have to use more than just query.get({source: "cache"}). But getDocsFromCache didn't work for me. Every time i call getDocsFromCache, it does not throw any errors but snapshot.empty is always true so i can't access to my documents(collection).

If i have to cache manually, how? If not, what am i missing?

Thank you.

import {
 ​collection,
 ​getDocs,
 ​getDocsFromCache,
 ​query,
} from 'firebase/firestore';
import { db } from '../firebase-config';

export const getReviews = async () => {
 ​const q = query(collection(db, 'review'));

 ​try {
   ​const snapshot = await getDocsFromCache(q);

   ​console.log(snapshot.empty);   // always true but not throwing any error

   ​snapshot.forEach((doc) => {
     ​/* ... */
   ​});

 ​} catch (e) {
   // never reach here
   ​const snapshot = await getDocs(q);

   /* ... */
 ​}
};

I'm new to Firebase and I found getDocsFromCache. I heard that firebase updated it's version to version 9, (modular) and i have to use more than just query.get({source: "cache"}). But getDocsFromCache didn't work for me. Every time i call getDocsFromCache, it does not throw any errors but snapshot.empty is always true so i can't access to my documents(collection).

If i have to cache manually, how? If not, what am i missing?

Thank you.

import {
 ​collection,
 ​getDocs,
 ​getDocsFromCache,
 ​query,
} from 'firebase/firestore';
import { db } from '../firebase-config';

export const getReviews = async () => {
 ​const q = query(collection(db, 'review'));

 ​try {
   ​const snapshot = await getDocsFromCache(q);

   ​console.log(snapshot.empty);   // always true but not throwing any error

   ​snapshot.forEach((doc) => {
     ​/* ... */
   ​});

 ​} catch (e) {
   // never reach here
   ​const snapshot = await getDocs(q);

   /* ... */
 ​}
};

• javascript
• reactjs
• firebase
• google-cloud-firestore

• 1 getDocsFromCache being empty is not an error condition when what's in the cache says that your query has no results. If at any point in the past, when the last time you called getDocs(q) returned no results, the cache will have stored the same response - no results. You can either purge your cache to try again or simply throw your own error when you get no results when you were expecting some. – samthecodingman Commented Dec 11, 2021 at 13:18
• 1 Yes I tried getDocsFromCache right after I successfully got some results with getDocs, but It was always returning empty response... Thanks for your very helpful ment. – dooyeong Commented Dec 11, 2021 at 14:28

3 Answers 3

enableIndexedDbPersistence is deprecated (at least in firebase v9). Consider using the following approach (I took it here):

import { initializeFirestore, memoryLocalCache } from "firebase/firestore";

initializeFirestore(app, {
  localCache: memoryLocalCache(),
});

you may also import and use persistentLocalCache instead of memoryLocalCache if you like.

From the documentation on configuring offline persistence:

For the web, offline persistence is disabled by default. To enable persistence, call the enablePersistence method.

So make sure to enable the cache by calling this right after initializing Firebase and Firestore:

import { enableIndexedDbPersistence } from "firebase/firestore"; 

enableIndexedDbPersistence(db);

I had the same issue, This doc resolved my problem. you can try this one as a example.

    const db = initializeFirestore(app, {
  localCache: persistentLocalCache({
    cacheSizeBytes: 200000000,
    useFetchStreams: true,
    tabManager: persistentMultipleTabManager(),
  }),
});