路由守卫和路由两种工作模式

【一】路由守卫

• 全局守卫、独享守卫、组件内守卫
• 是否登录，登录后才能访问，没登录重定向到login

router/index.js

//全局前置路由守卫————初始化的时候被调用、每次路由切换之前被调用
router.beforeEach((to, from, next) => {
    console.log('前置路由守卫', to, from)
    if (localStorage.getItem('name')) { //判断是否需要鉴权
        next()
    } else {
        alert('名不对，无权限查看！')
    }

})

【二】两种工作模式

• 对于一个url来说，什么是hash值？—— # 及其后面的内容就是hash值。
• hash值不会包含在 HTTP 请求中，即：hash值不会带给服务器。
• hash模式：
  • 地址中永远带着#号，不美观
  • 若以后将地址通过第三方手机app分享，若app校验严格，则地址会被标记为不合法。
  • 兼容性较好
• history模式：
  • 地址干净，美观
  • 兼容性和hash模式相比略差。
  • 应用部署上线时需要后端人员支持，解决刷新页面服务端404的问题