"query is not a function" Next Js getServerSideprops and firebase error-CodePudding

I'm using NextJS and firebase as my primary database for the app that I'm currently building for an NGO. and I ran into an issue.

import {
  collection,
  where,
  query,
  getDocs
} from '@firebase/firestore';
import { db } from '../../../services/firebase';

export async function getServerSideProps({query}) {
  
  const user = await getDocs(query(collection(db, 'members'), where('id', '==', query)))
  return {
    props: {
      // VisionInfo: JSON.stringify(user.docs.map(item => item.data()))
      json: JSON.stringify('Hello')
    }
  };
}

The only way to get Query from the URL in NextJS in serverSideProps is to use the keyword "query" but the same keyword is used to fetch firebase document. The error shows "query is not a function" Is there anyway I could get Query into serversideprops ?

CodePudding user response：

The issue arises because you also have "query" in getServerSideProps parameters. Try naming the import from Firestore SDK (or the query param) as shown below:

import { query as fireQuery } from '@firebase/firestore';

export async function getServerSideProps({query}) {
  const user = await getDocs(fireQuery(collection(db, 'members'), where('id', '==', query)))
  // use fireQuery here      ^^^
})