在Vue.js/Firebase登录认证界面中设置路由守卫
在Vue.js/Firebase登录认证界面中设置路由守卫
提问于 2019-05-24 05:36:52
我正在基于以下教程构建一个基本的Vue.js/Firebase身份验证接口：(part 1- https://medium.com/@oleg.agapov/basic-single-page-application-using-vue-js-and-firebase-part-1-9e4c0c11a228)，(part 2- https://medium.com/@oleg.agapov/basic-single-page-application-using-vue-js-and-firebase-part-2-143a3084266f)。我已经完整地构建了这个应用程序，除了路由守卫的某些方面之外，它大部分都可以工作。创建帐户后，我可以成功登录并将帐户信息存储在firestore数据库中。问题是，在登录之后，手动将"http://localhost:8080/home“重定向到"http://localhost:8080/”会导致主页转换回一个登录页面，该登录页面会提示用户注册或签名in...while用户仍在登录。"http://localhost:8080/“是登录页面的路径，但是在用户登录到主页时输入"http://localhost:8080/”在逻辑上应该只是重定向到主页。我如何设置才能在登录时输入"http://localhost:8080/“返回到主页，而不是登录页面？以下是基于教程的我的路由：
import Vue from 'vue'
import Router from 'vue-router'
import firebase from 'firebase'
const routerOptions = [
{ path: '/', component: 'Landing' },
{ path: '/signin', component: 'Signin' },
{ path: '/signup', component: 'Signup' },
{ path: '/home', component: 'Home', meta: { requiresAuth: true } },
{ path: '*', component: 'NotFound' }
]
const routes = routerOptions.map(route => {
return {
...route,
component: () => import(`@/components/${route.component}.vue`)
}
})
Vue.use(Router)
const router = new Router({
mode: 'history',
routes
})
router.beforeEach((to, from, next) => {
const requiresAuth = to.matched.some(record => record.meta.requiresAuth)
const isAuthenticated = firebase.auth().currentUser
if (requiresAuth && !isAuthenticated) {
next('/signin')
} else {
next()
}
})
export default router页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/56283230
复制相关文章
相似问题