How do I add the Firebase app check SDK in my web app?-CodePudding

I have registered my reCAPTCHA v3 secret key in my Firebase console for my web app. Now I want to add the app check SDK in my client side. These are my imports in my index.html:

<script src="https://www.gstatic.com/firebasejs/9.14.0/firebase-app-compat.js"></script>

<script src="https://www.gstatic.com/firebasejs/9.14.0/firebase-database-compat.js"></script>

<script src="https://www.gstatic.com/firebasejs/9.14.0/firebase-auth-compat.js"></script>`

<script src="https://www.gstatic.com/firebasejs/9.14.0/firebase-app-check-compat.js" async defer></script>

<script src="https://www.google.com/recaptcha/api.js?render=MY_SITE_KEY_HERE" async defer></script>

This is my javascript:

const firebaseConfig = {
  apiKey: "ABCDEF",
  authDomain: "ABCDEFGH.firebaseapp.com",
  projectId: "ABCDEFGHO",
  storageBucket: "project_name.appspot.com",
  messagingSenderId: "123456789",
  databaseURL: "https://project)name.firebaseio.com",
  appId: "1:12345678:web:f4r3rsdf322e112c800"
};

firebase.initializeApp(firebaseConfig);

document.getElementById("submit").addEventListener("click",function(event){

     firebase.initializeAppCheck(firebase.initializeApp(firebaseConfig),{
        provider: new ReCaptchaV3Provider('MY_SITE_KEY_HERE'),
        isTokenAutoRefreshEnabled: true
     });
})

Upon clicking the submit button, this error pops up in my console:

Uncaught (in promise) ReferenceError: ReCaptchaV3Provider is not defined

How do I fix this? Is this the correct way to install the app check SDK?

CodePudding user response：

you need add import code

import {ReCaptchaV3Provider} from "firebase/app-check"