通过 API URL 尝试调用 Firestore 数据库时报错 401

Question

I am attempting to fetch data from my Firestore Database through getServerSideProps in my Next.js. The error I am getting is related to authentication (As a sidenote: I am using NextAuth for User authentication).

When pasting the URL https://firestore.googleapis.com/v1/projects/PROJECT-ID/databases/products in the browser, I get this:

{
  "error": {
    "code": 401,
    "message": "Request is missing required authentication credential. Expected OAuth 2 access token, login cookie or other valid authentication credential. See https://developers.google.com/identity/sign-in/web/devconsole-project.",
    "status": "UNAUTHENTICATED",
    "details": [
      {
        "@type": "type.googleapis.com/google.rpc.ErrorInfo",
        "reason": "CREDENTIALS_MISSING",
        "domain": "googleapis.com",
        "metadata": {
          "service": "firestore.googleapis.com",
          "method": "google.firestore.admin.v1.FirestoreAdmin.GetDatabase"
        }
      }
    ]
  }
}

My getServerSideProps function looks like this:

export async function getServerSideProps(context) {
      const session = await getSession(context);
     const products = await fetch("https://firestore.googleapis.com/v1/projects/PROJECT-ID/databases/products").then(
       (res) => res.json()
     );

     return {
       props: {
         products,
         session
       },
     };
   }

The Firestore database has reading and writing permissions enabled.

The linked documentation in the error message is referring to the integration of Google Sign-In. Do I have to use Firebase Authentication to access the Firestore Database through the API URL?

Answer 1

If you have permissions enabled, you need to pass an ID token to the REST API URL

Authorization: Bearer ${idToken}

You can get the idToken from the client then save the token as a cookie.

 import { getAuth } from "firebase/auth"
        
   //fetch token from a signed in user

   const fetchToken= async () => {    

     const idToken = await getAuth().currentUser.getIdToken()
       
     //save the token as a cookie

  }
   
  fetchToken()

In getServerSideProps, you can then get the token from the cookie and pass it to the REST API URL.