FirebaseError: [code=permission-denied] when fetching data from Firestore

I'm currently working on creating a serverless database using Firebase. However, I'm encountering an error whenever I attempt to fetch the data, even though my internet connection is stable and working properly.

Instead of receiving the expected data from Firestore, I got this error

The error:

> @firebase/firestore: Firestore (10.0.0): Could not reach Cloud Firestore backend. Connection failed 1 times. Most recent error: FirebaseError: [code=permission-denied]: Permission denied on resource project find-jobs-5c4e7.firebaseapp.com.
> This typically indicates that your device does not have a healthy Internet connection at the moment. The client will operate in offline mode until it is able to successfully connect to the backend.
>

the configuration:

import { initializeApp } from "firebase/app";
import { getAuth } from "firebase/auth";
import { getFirestore } from "firebase/firestore";
import { getDatabase } from "firebase/database";
import { initializeFirestore, CACHE_SIZE_UNLIMITED } from "firebase/firestore";

const firebaseConfig = {
  apiKey: process.env.REACT_APP_FIREBASE_KEY,
  authDomain: process.env.REACT_APP_AUTH_DOMAIN,
  projectId: process.env.REACT_APP_PROJECT_ID,
  storageBucket: process.env.REACT_APP_STORAGE_BUCKET,
  messagingSenderId: process.env.REACT_APP_SENDER_ID,
  appId: process.env.REACT_APP_APP_ID,
  measurementId: process.env.REACT_APP_MEASUREMENT_ID,
  databaseURL: process.env.REACT_APP_DATABASE_LINK
};

// Initialize Firebase
const app = initializeApp(firebaseConfig);

export const auth = getAuth(app);
export const db = getFirestore(app, {
  experimentalForceLongPolling: true,
});

export default app;

data fetching code:

const [list, setList] = useState([]);
  const CollectionRef = collection(db, "users");

  const getList = async () => {
    try {
      const data = await getDocs(CollectionRef);
      const filteredData = data.docs.map((doc) => ({
        ...doc.data(),
        id: doc.id,
      }));
      setList(filteredData);
    } catch (err) {
      console.error(err);
    }
  };

  useEffect(() => {
    getList();
  }, []);
      

</details>


# 答案1
**得分**: 0

我通过直接在代码中添加密钥值而不是使用环境文件来解决了这个问题。此外，我将“getFirestore”函数替换为“initializeFirestore”。这些更改成功解决了我遇到的问题。

<details>
<summary>英文:</summary>

I was able to resolve the issue by adding the key values in the code directly instead of using the env file. Additionally, I replaced the &quot;getFirestore&quot; function with &quot;initializeFirestore&quot;. These changes successfully addressed the problem I was experiencing.

</details>