小编str*_*rig的帖子

Firebase Auth和Vue路由器

我正在尝试使用firebase验证Vue.js应用程序.

我有一个问题,如果在登录时尝试直接访问受登录保护的URL,路由器将加载并检查auth状态,然后firebase.js有时间返回auth响应.这导致用户被退回到登录页面(当他们已经登录时).

如何从firebase检索auth状态之前延迟vue-router导航?我可以看到firebase将auth数据存储在localStorage中,是否可以安全地检查它是否作为初步身份验证检查存在?理想情况下,最终结果是在用户通过身份验证时显示加载微调器或其他内容,然后他们应该能够访问他们导航到的页面.

路由器/ index.js

let router = new Router({
  mode: 'history',
  routes: [
    {
      path: '/',
      name: 'Home',
      component: Home
    },
    {
      path: '/login',
      name: 'Login',
      component: Login
    },
    {
      path: '/example',
      name: 'Example',
      component: Example,
      beforeEnter: loginRequired
    }
})

function loginRequired (to, from, next) {
  if (authService.authenticated()) {
    next()
  } else {
    next('/login')
  }
}
Run Code Online (Sandbox Code Playgroud)

auth.js

import * as firebase from 'firebase'

var config = {
    // firebase config
}

firebase.initializeApp(config)

var authService = {

  firebase: firebase,
  user: …
Run Code Online (Sandbox Code Playgroud)

firebase vue.js firebase-authentication vue-router

10
推荐指数
3
解决办法
4606
查看次数