页面重新加载时的 Nuxtjs、VUEX 和 Firebase 身份验证

dsj*_*sen 5 firebase firebase-authentication vuex nuxt.js

我在我的 Nuxt 应用程序中使用 Firebase 身份验证,但我找不到在我的商店中保留用户登录状态的好方法。

我通过在我的商店中调度异步操作来登录用户。当用户刷新浏览器(重新加载)时,用户将在我的应用中注销,但仍会在 Firebase 中保持登录状态(因为他们没有注销)。这是一个问题,因为用户必须再次登录我的应用程序才能查看受限页面并执行某些操作。

我试图在 NuxtServerInit 中获取用户(从 index.js 商店,因为我使用模块模式)从:

firebase.auth().currentUser
Run Code Online (Sandbox Code Playgroud)

但它返回空值,我也尝试听:

firebase.auth().onAuthStateChanged((user)
Run Code Online (Sandbox Code Playgroud)

但它也返回 null

我还尝试创建一个中间件来检查用户当前是否已登录,但它也返回 null。

在之前的 Vue 项目中,我可以在 main.js 文件中创建钩子,如下所示:

new Vue({
  router,
  store,
  render: h => h(App),
  created () {
    firebase.auth().onAuthStateChanged((user) => {
      if (user) {
        store.dispatch('autoSignIn', user)
      }
    })
  }
}).$mount('#app')
Run Code Online (Sandbox Code Playgroud)

但是我不知道如何在我的 Nuxt 应用程序中做同样的事情。

我很欣赏有关如何解决问题的任何想法,让我的用户保持登录状态。