要解决Angularfire Appcheck未正确初始化的问题,需要按照以下步骤进行操作:
import { AngularFireModule } from '@angular/fire';
import { AngularFireAuthModule } from '@angular/fire/auth';
import { AngularFireDatabaseModule } from '@angular/fire/database';
import { AngularFireFunctionsModule } from '@angular/fire/functions';
import { AngularFireMessagingModule } from '@angular/fire/messaging';
import { AngularFireStorageModule } from '@angular/fire/storage';
import { AngularFirestoreModule } from '@angular/fire/firestore';
import { AngularFireAppCheckModule } from '@angular/fire/app-check';
@NgModule({
imports: [
AngularFireModule.initializeApp(environment.firebase),
AngularFireAuthModule,
AngularFireDatabaseModule,
AngularFireFunctionsModule,
AngularFireMessagingModule,
AngularFireStorageModule,
AngularFirestoreModule,
AngularFireAppCheckModule,
],
// ...
})
export class AppModule { }
在Firebase控制台中启用App Check以获取在应用程序中使用的reCAPTCHA密钥。
在Angular中配置App Check,如下所示:
import { AngularFireAppCheckModule, USE_EMULATOR } from '@angular/fire/app-check';
@NgModule({
imports: [
AngularFireModule.initializeApp(environment.firebaseConfig),
AngularFireAppCheckModule,
],
providers: [
{ provide: USE_EMULATOR, useValue: ['localhost', 5003] }, // Optional configuration for using App Check emulator on localhost.
{
provide: FUNCTIONS_REGION,
useValue: 'us-central1',
},
],
})
class AppModule {}
import { AngularFireAppCheck } from '@angular/fire/app-check';
@Component({
// ...
})
export class MyComponent {
constructor(private appCheck: AngularFireAppCheck) {}
ngOnInit() {
this.appCheck.activate(environment.reCAPTCHASiteKey);
}
}