Cannot get firebase appID when activate appCheck in React app

[iamzifei]

I'm doing a student project and try to put app-check in the web client

My web client is using Create-React-App, I have import firebase and following the appCheck instruction here: https://firebase.google.com/docs/app-check/web#with-npm

My firebase file looks like the following:

import firebase from "firebase/app";
import "firebase/auth";
import "firebase/firestore";
import "firebase/functions";
import "firebase/storage";
import "firebase/app-check";

const firebaseConfig = {
  apiKey: process.env.REACT_APP_FB_API,
  authDomain: process.env.REACT_APP_FB_DOMAIN,
  projectId: process.env.REACT_APP_FB_PROJECT,
  storageBucket: process.env.REACT_APP_FB_BUCKET,
  messagingSenderId: process.env.REACT_APP_FB_SENDER,
  appID: process.env.REACT_APP_FB_APP,
};

if (!firebase.apps?.length) {
  firebase.initializeApp(firebaseConfig);
}

const appCheck = firebase.appCheck();
appCheck.activate(process.env.REACT_APP_CAPTCHA_SITE);

export default firebase;

as long as I put appCheck in, I can see the client is trying to make the following calls and it failed because of undefined appID
https://content-firebaseappcheck.googleapis.com/v1beta/projects/student-test-site/apps/undefined:exchangeDebugToken?key=AIzaSyCU4X1qOmDaBCDLIpmj90qAey5fnbKhmkN

I'm pretty sure I get env values from process.env, and my firebase.initializeApp seems working, as without put appCheck in, everything works fine.

[hsubox76]

Is that an exact copy of your code? The capitalization on appID is incorrect, the d should not be capitalized.