vuejs+koa2+mysql全栈开发个人博客(三) —— 页面访问权限

在这篇博客中，我将会详细介绍这个博客搭建的第二个技术要点：
页面访问权限

我们知道，对于这个博客而言。后台是游客不可访问的，前台是公开的。那么如何区分开来呢？

给页面设置meta属性

对于每个页面，如果是公开的页面，则设置{auth:false}，意为没有权限。
如果是私有页面，则不设置auth属性。

每次页面路由变化时，会触发路由的beforeEach方法

router.beforeEach(({meta,path},from,next)=>{
  store.dispatch('showProgress',0);
  // NProgress.start();
  let {auth=true}=meta  //meta为false则auth为false；否则auth为true
  let isLogin = Boolean(store.state.token) //转换为true or false

  /*
      访问不需要权限的设置meta:false
      注册也要设置成meta:false
  */
  //访问的是需要权限的页面且没有登录
  if(auth&&!isLogin){
    return next({path:'/login'});
  }
  // 如果登录了以后再访问reg和login则路由到Home
  if(isLogin&&(path=='/login'||path=='/reg')){
    return next({path:'/admin'});
  }
  // 未登录的情况下访问reg则直接路由
  next();
});