如何在我的 web 应用程序中添加 Firebase 应用程序检查 SDK？

Question

我已经在我的 web 应用程序的Firebase console中注册了我的reCAPTCHA v3密钥。 现在我想在我的客户端添加应用程序检查 SDK。 这些是我在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>

这是我的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
     });
})

---

单击submit按钮后，此错误会在我的控制台中弹出：

未捕获（承诺）ReferenceError：未定义 ReCaptchaV3Provider

我该如何解决？ 这是安装应用程序检查 SDK 的正确方法吗？

Answer 1

您需要添加导入代码

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