全局路由守卫基础使用（登录功能）

1：在router index.js 文件里面设置全局路由守卫

router.beforeEach((to,from,next)=>{
  //验证token,只有存在token的时候，才能跳转到内容页
  let token = localStorage.getItem("loginToken"); //拿到token
  if( token || to.path === '/login'){
    next()
  }else{
    next('/login')
  }
})

2：登录成功时候存储token

 request.post("/user/login",this.form).then(res=>{
        if(res.code === 200){
          /*用户存在，*/
          sessionStorage.setItem("userToken",res.data.token)
          //用户存在，存储token
          console.log("------用户登录成功")
          localStorage.setItem("loginToken",res.data.token);
          if(res.data.grade === 1){ //身份是学生
            this.$router.push("/sHome")
          }
          else if(res.data.grade === 2){//身份是教师
            this.$router.push("/tHome")
          }
          this.$message({//给出提示信息
            type:"success",
            message:"登陆成功"
          })
        }else{//给出错误信息
            this.$message({
              type:"error",
              message:res.msg,
            })
          }
        })

3：axios请求时设置请求头，携带token

request.interceptors.request.use(config => {
    config.headers['Content-Type'] = 'application/json;charset=utf-8';
 // 设置请求头，请求时携带token
    config.headers['token'] = localStorage.getItem("loginToken"); 
    return config
}, error => {
    return Promise.reject(error)
});

4：后端接收登录请求的时候设置token，返回给前端

@PostMapping("/login")
    public R<User> login(@RequestBody User user){
        String account = user.getAccount();
        String password = user.getPassword();

        LambdaQueryWrapper<User> queryWrapper = new LambdaQueryWrapper<>();
        queryWrapper.eq(User::getAccount,account);
        queryWrapper.eq(User::getPassword,password);

        User userR = userService.getOne(queryWrapper);
/*        生成token并把token封装在userR中*/
        String token = JWTUtil.token(userR.getId(),userR.getAccount(),userR.getGrade());
        userR.setToken(token);

        if(userR!=null){
            //登陆成功
            log.info("用户成功登录");
            return R.success(userR);
        }
        return R.error("用户名或密码错误");
    }