Abdullah
Abdullah

Reputation: 37

No firebase.app.App instance is currently initialized in Angular Application

I was using firebase mobile authenication in web application, when I use recaptchaVerifier, when the recaptchaVerifier is not shown and given this error, I am aready using realtime database in the project that working fine but dont know why at mobile authenitcation module is not working app.module.ts

import { environment } from './../environments/environment';

imports: [ AngularFireModule.initializeApp(environment.firebaseConfig)]

component.module.ts

ngOnInit() {


this.windowRef = this.win.windowRef
this.windowRef.recaptchaVerifier = new firebase.auth.RecaptchaVerifier('recaptcha-container')

this.windowRef.recaptchaVerifier.render()

} enter image description here

Please help me to sortout this!

Upvotes: 2

Views: 945

Answers (2)

Nikhil
Nikhil

Reputation: 1018

The correct place for initializing the firebase config is under app module. That you have done correctly. Just add a delay of 2 to 3 seconds like below. It will not give any error. It looks like initializing firebase config takes few seconds time.

ngOnInit() {

setTimeout(() => {
     this.windowRef = this.win.windowRef
     this.windowRef.recaptchaVerifier = new firebase.auth.RecaptchaVerifier('recaptcha-container')

     this.windowRef.recaptchaVerifier.render()

}, 2000);

}

Upvotes: 0

Sajeetharan
Sajeetharan

Reputation: 222582

You need to Initialize the firebase instance with the initializeApp method

In the Component's ngOnInit() function add the following line before you create the RecaptchaVerifier.

firebase.initializeApp(config);
this.windowRef.recaptchaVerifier.render()

Upvotes: 2

Related Questions