vue实现路由权限 : 刷新页面没触发 router.beforeEach

今天遇到个问题，刷新页面没触发 router.beforeEach一直以为是自己的 router.beforeEach 没做好判断，但是查阅了很多资料，都是正常的router.beforeEach((to,from,next)=>{let token = localStorage.getItem('tokenarray')const {path} = toif(!!token){if(pat

guhy fighting

4518人浏览 · 2021-11-30 16:56:49

guhy fighting · 2021-11-30 16:56:49 发布

今天遇到个问题，刷新页面没触发 router.beforeEach
一直以为是自己的 router.beforeEach 没做好判断，但是查阅了很多资料，都是正常的

router.beforeEach((to,from,next)=>{
  let token = localStorage.getItem('tokenarray')
  const {path} = to
  if(!!token){
    if(path === '/login'){
      next({path:'/'})
    }else{
      next(); //成功则跳转
    }
  }else {
    if(path === '/login'){
      next()
    }else{
      Logout()
    }
  }
})

这里很好的实现了路由权限，但是我只要在login页面刷新就不会触发router.beforeEach
想想这个问题值得自己记录一下，也算是给自己的一个提醒，之前在跨域处理的proxy里面加了一段，只要遇见/login开头的接口就走跨域代理处理，没想到自己的router的path也是/login，这样导致只要访问刷新login页面刷新就不会触发router.beforeEach

    proxy: {
      '^/login/*': {
        target: 'http://localhost:8080',   //代理接口
        changeOrigin: true,
        pathRewrite: {
          '^/api': ''    //代理的路径
        }
      }
    }

猛然间为自己的无知干一杯，自此，问题解决