CODEWITHSUNDEEP
javascriptreactjsfirebasegoogle-cloud-firestorenext.js
pann
pann

Reputation: 74

Firebase Invalid Resource Field Value when adding data to Firestore

I want to add a data to my Firestore database from my NextJs project, but I've come across this error message:

FirebaseError: Request failed with error: Invalid resource field value in the request.

Here is my code snippet, I've used the same example on the Firestore documentation

const db = getFirestore(initFirebaseApp())
return await setDoc(doc(db, "cities", "LA"), {
  name: "Los Angeles",
  state: "CA",
  country: "USA"
});

But I got this response

@firebase/firestore: Firestore (10.0.0_lite): RestConnection RPC 'Commit' 0x1d57740f failed with error: {"code":"failed-precondition","name":"FirebaseError"} url: https://firestore.googleapis.com/v1/projects//databases/(default)/documents:commit request: {"writes":[{"update":{"name":"projects//databases/(default)/documents/cities/LA","fields":{"name":{"stringValue":"Los Angeles"},"state":{"stringValue":"CA"},"country":{"stringValue":"USA"}}}}]}

I assume it was because of the Firestore Rules but I've already changed it to

match /{document=**} {
  allow read, write: if true;
}

I'm not using any auth as of now and fetching data seems fine, but I can't seem to add new data with addDoc() or setDoc(). I'm currently using Firebase v10.0.0 if that helps

Upvotes: 0

Views: 928

Answers (1)

pann
pann

Reputation: 74

I've found the problem, I'm currently using Next.js and the problem only occurred on the client component.

So it turns out the Firebase config I store in the .env file, I've named them FIREBASE_KEY while this doesn't have any problem for server components, client component can't access them so basically my initFirebaseApp() returns an incomplete app.

The fix was just making the env variables have NEXT_PUBLIC_ in front of them like NEXT_PUBLIC_API_KEY and the function works fine now.

Upvotes: 1

Related Questions