I am creating a react application using firebase for the sign on. When I call the google sign on method, I want to be able to detect if the user exists in our UserStorage Collection (Has already signed up before) if they have not ,it should direct them to the sign up component, otherwise it should direct them to a fitness component. From the component we handle the sign on with:
async handleGoogleSignIn(event) {
event.preventDefault();
this.props.googleSignIn(this.state);
try {
const bool = await this.isExistingUser()
if(bool == true) {
this.props.history.push('/fitness');
} else {
this.props.history.push('/signup');
}
} catch (error) {
this.props.history.push('/home');
}
}
isExistingUser is defined as:
isExistingUser() {
var id = ''
firebase.auth().onAuthStateChanged(function(user) {
try {
if (user) {
id = user.uid
for (var i = 0; i < this.props.fetchedUser.length; i++) {
if(this.props.fetchedUser[i].id == id) {
return true;
}
}
return false;
} else {
console.log('No user is signed in.')
}
} catch (error) {
console.log('ERROR: ', error)
}
});
return false;
}
this.props.fetchedUser should have the list of all users that we have stored in out collection, and the google sign on method we are getting from props is:
export const googleSignIn = () => {
return (dispatch, getState, {getFirebase, getFirestore}) => {
const firebase = getFirebase();
const firestore = getFirestore();
const provider = new firebase.auth.GoogleAuthProvider()
firebase.auth().signInWithRedirect(provider).then(async result => {
var user = result.user;
console.log('GOOGLE SIGN IN: ', user)
}).then(() => {
dispatch({ type: 'GOOGLE_LOGIN_SUCCESS' });
}).catch((error) => {
dispatch({ type: 'GOOGLE_LOGIN_ERROR', error });
});
}
};
The way we have this, it always directs to the sign up component. I think it has something to do with the asynchronous authentication, so it redirects to sign up before the authentication is finished. Any solutions to this problem would be greatly appreciated.
firebase.auth().onAuthStateChanged()register an observer - it gets triggered over tie when the user's auth state changes. It's not good for getting one-time readings that must be returned immediately. For that, you're supposed to usefirebase.auth().currentUser. But if you are trying to wait until the user signs in to do something, you should let the observer drive the flow of the code.