Currently grappling with a project where I'm facing some challenges... I've opted for VueJS on the frontend and implemented Firebase Authentication for user login.
I'm trying to determine the login status of a user by using firebase.auth().currentUser;
(If it returns null, then no user is logged in) Sounds straightforward, right?
In my VueJS created() function, when I run firebase.auth().currentUser;, it consistently returns null. It seems like Vue is attempting to retrieve the data before it's fully loaded.
Your patience and assistance are greatly appreciated - I'm fairly new to both Vue and firebase! Code snippets have been provided below.
Vue.config.devtools = true;
var app = new Vue({
el: '#app',
data: {
user: '',
loggedIn: false
},
created() {
var user = firebase.auth().currentUser;
if (user != null){
this.user = user;
this.loggedIn = true;
} else {
this.loggedIn = false;
}
}
})
Displayed below are the firebase scripts that are included at the bottom of the page body
<script src="https://www.gstatic.com/firebasejs/7.14.1/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/7.15.5/firebase-auth.js"></script>
<script src="https://www.gstatic.com/firebasejs/7.14.1/firebase-database.js"></script>
<script src="https://www.gstatic.com/firebasejs/7.14.1/firebase-analytics.js"></script>
<script src="js/firebaseConfig.js" type="text/javascript"></script>
How can I rectify this issue without resorting to a setTimeout() method? Additionally, which script manages this session within Firebase?