Nuxt Firebase 身份验证中间件

Question

我使用 Nuxt(vue) 作为前端，使用 Firestore 和 Authentication 作为后端。我得到了一定数量的身份验证，但我的问题是刷新浏览器会重置状态，因此我的中间件返回错误结果。

这里有一些代码片段：

中间件：

export default function ({store, redirect, route}) {

    const userIsLoggedIn = !!store.state.currentUser; 

    if(!userIsLoggedIn) {
        return redirect ('/')
    } 
}

插入：

import { auth } from '@/services/firebaseInit.js'

export default (context) => {
    const { store } = context

    return new Promise((resolve, reject) => {
        auth.onAuthStateChanged(user => {
            store.commit('setCurrentUser', user)
            resolve()
        })
    })
}

现在这适用于运行应用程序，但是当有人刷新您需要身份验证的页面时，它不起作用并重定向到 /，现在我不知道如何解决该问题，希望得到帮助，如果您需要更多代码，我会提供它。

编辑 1：

   async nuxtServerInit ({ commit }, { req }) {
            let user = await firebase.auth().currentUser

            commit('setCurrentUser', user)
        }

Answer 1

您需要在nuxtServerInit方法中初始化您的用户，否则您的中间件将在空用户的服务器上执行，因此会发生重定向。

您需要从 req 对象中获取用户数据。请参阅此 repo 以获取参考实现https://github.com/davidroyer/nuxt-ssr-firebase-auth.v2