Firebase身份验证登录，但在刷新时重定向到登录

我正在尝试使用谷歌进行firebase身份验证登录。有些功能可以正常工作，但每次我在登录时刷新页面时，它都会加载登录页面，而不是我当前所在的页面。当这种情况发生时，我确信我仍在登录，因为我可以直接键入安全URL，它会加载auth用户信息

工作

• 如果未登录，则重定向到登录

• 登录后，登录和bein重定向到主页（“/”）

• 登录后在页面之间导航

不起作用

• 仅刷新身份验证后，我被重定向到登录屏幕 页面，即使我登录了。它应该只是刷新页面

这是我的登录名、Main、Router和index.js。还有其他配置文件和组件，但它们工作正常

Login.vue

<template>
      <el-button plain v-on:click="login" >Iniciar sesión</el-button>
</template>
<script>
import firebase from '../firebaseConfig.js'
export default {
  name: 'Login',
  methods:{
    login: function(){
      let provider = new firebase.auth.GoogleAuthProvider();
      firebase.auth().signInWithPopup(provider).then((result) => {
         console.log(result.user.email);
         this.$router.replace("/");
      }).catch(err => console.log(error))
    }
  }
}
</script>

<template>
<h1>Welcome {{usuario}}
</template>

<script>
import firebase from '../firebaseConfig.js'
export default {
  name: 'Main',
  data () {
    return {
        usuario: "loading..."
    }
  },
  methods:{
    logout: function(){
      firebase.auth().signOut().then(() => {
        this.$router.replace('login')
      })
    }
  },
  created: function(){  
    this.user = firebase.auth().currentUser; 
      if(this.user) { 
        this.usuario = this.user.email; 
      } 
  }
}
</script>

main.js

import Vue from 'vue'
import App from './App'
import router from './router'

import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
Vue.use(ElementUI);

import firebase from './firebaseConfig.js'

Vue.config.productionTip = false

new Vue({
          router,
          el: '#app',         
          components: { App },
          template: '<App/>'
        })

从“Vue”导入Vue
从“./App”导入应用程序
从“./路由器”导入路由器
从“元素ui”导入元素ui；
导入'elementui/lib/theme chalk/index.css'；
Vue.use（ElementUI）；
从“./firebaseConfig.js”导入firebase
Vue.config.productionTip=false
新Vue({
路由器，
el:“#应用程序”，
组件：{App}，
模板：“”
})

在main.js文件中尝试以下操作：

let app;

firebaseApp.auth().onAuthStateChanged(user => {
    if (!app) {
    app = new Vue({
      router,
      store,
      render: h => h(App)
    }).$mount("#app");
  }

});

---

因此，您呈现您的应用程序-在authStateChange侦听器中，您需要在AuthStateChanged上注册，以等待firebase从本地存储加载用户或通过网络登录。只有在这之后，你才能发布router-guard。你修好了吗？首先，你会得到一个错误，因为“用户”从未被使用过。但是，这也是行不通的。

let app;

firebaseApp.auth().onAuthStateChanged(user => {
    if (!app) {
    app = new Vue({
      router,
      store,
      render: h => h(App)
    }).$mount("#app");
  }

});