如何在 Angular 中初始化 Firebase 应用检查

问题描述

我想知道如何使用 angular 初始化 firebase 应用程序检查。

我正在使用 angular fire，但在使用任何服务之前我不确定如何初始化 firebase 应用程序检查

文档有这个

在您访问任何 Firebase 服务之前，将以下初始化代码添加到您的应用程序中。

firebase.initializeApp({
  // Your firebase configuration object
});

const appCheck = firebase.appCheck();
// Pass your reCAPTCHA v3 site key (public key) to activate(). Make sure this
// key is the counterpart to the secret key you set in the Firebase console.
appCheck.activate('abcdefghijklmnopqrstuvwxy-1234567890abcd');

但是这如何在应用模块中完成。目前我像这样导入角火

@NgModule({
  declarations: [
   ...
  ],imports: [
    AngularFireModule.initializeApp(environment.firebaseConfig),],]

更新：

我知道这可能不是 angular fire 库的一部分，因为新的 firebase app-check 是如何的，但我注意到有一个原生的 firebase 库 https://www.npmjs.com/package/@firebase/app-check

我很高兴使用它（例如以某种方式覆盖本机 firebase js 对象），只要代码能够在调用任何服务之前将其应用到正确的位置，并且它不会在打字稿中出现编译错误

参考我的版本如下：

角度： 10.2.5

Firebase： 8.6.0

AngularFire： 6.1.5

调试本地主机版本也必须工作

解决方法

这样做：

// firebase-initialization.ts
import firebase from 'firebase/app';
import 'firebase/app-check';

// Environment Config
import { environment } from './path/to/environments';

const app = firebase.initializeApp(environment.firebase);
const appCheck = app.appCheck()
appCheck.activate('');

然后将应用模块中的文件导入为：

import "firebase-initialization"

,

我不得不使用事件 DOMContentLoaded 来使应用检查与我的 angularJS 应用一起工作，也许您可​​以尝试一下：

window.addEventListener('DOMContentLoaded',() => {
  var appCheck = firebase.appCheck()
  appCheck.activate('captchatokenid')
})