vue路由器上的保护功能仅在第二个循环中起作用

时间:2018-11-15 19:46:44

标签: javascript vuejs2 vue-router

我正在尝试使用基于角色的防护来保护路由,但是在执行路由时,仅对我访问的第二条路由执行验证。这一次又一次地发生,这似乎是子路径的问题,只有在子路径访问的第二条路径中执行验证。我附上我的代码

router.beforeEach((to,from, next)=>{
        const rolesToPath = (to.meta.roles)?to.meta.roles:null //roles authorized in next path
        const reqAuth     = to.matched.some(record=> record.meta.auth)
        const currentUser = store.state.currentUser //current user With Roles
        const homeRoute = '/dashboard'
        const loginRoute = '/login'

        if (reqAuth && currentUser) {
                let auth = matchRoles(rolesToPath,currentUser.roles)
                if (auth) {
                    next()
                } else {
                    next(homeRoute)
                }
            }


        function matchRoles(x,y){ //this function resolve if user is authorized
                                  // to next path
                let flag = false
                x.forEach((x)=>{
                    y.forEach((y)=>{
                        if (x.userRol==y.name) {
                            flag = true//if role user is on next path
                        }
                    })
                })

                if (flag) return true
                return false

            }

    })

这些是我要应用验证的路径

import Vue from 'vue'
import VueRouter from 'vue-router'
Vue.use(VueRouter)

export default new VueRouter({
  mode: 'history', // https://router.vuejs.org/api/#mode
  linkActiveClass: 'open active',
  scrollBehavior: () => ({ y: 0 }),
  routes:[
      {
      path: '/login',
      name: 'Login',
      component: Login,
      meta     : {
        auth: false,
        },
      },
      {
      path: '/register',
      name: 'Register',
      component: Register,
      meta     : {
        auth: false,
        },
      },
      {
      path: '/',
      redirect: '/dashboard',
      name: 'Home',
      component: DefaultContainer,
      meta     : {
        auth: false,
      },
      children: [
        {
          path      : 'credenciales',
          redirect  : '/credenciales/proveedores',
          name      : 'Credenciales',
          component : {
            render (c) { return c('router-view') }
          },
          children: [
            {
              path      : 'proveedores',
              name      : 'Proveedores',
              component : TablaProveedores,
              meta     : {
                auth: true,
                roles: [
                  {
                    userRol : 'tester',
                    lock : true,
                  }
                ]
              },
            },
            {
              path         : 'accesos',
              name         : 'Accesos',
              component : TablaProveedores,
              meta     : {
                auth: true,
                roles: [
                  {
                    userRol : 'admin',
                    lock : true,
                  }
                ]
              },
            },            
          ]
        },
  ]
})

0 个答案:

没有答案