路由前置守卫设置token存储

最新推荐文章于 2024-06-23 16:11:14 发布

浪里白条那片海

最新推荐文章于 2024-06-23 16:11:14 发布

阅读量35

点赞数

本文链接：https://blog.csdn.net/weixin_37806077/article/details/133105310

版权

登录页登录成功后保存token

1 / 保存用户名
2                             sessionStorage.setItem("username", data.user.name);
3                             sessionStorage.setItem("token", data.token);
4                             sessionStorage.setItem("userId", data.user.id);
5                             sessionStorage.setItem("roleId", this.ruleForm.role);
6                             sessionStorage.setItem("userinfo", JSON.stringify(userInfo));

在router.js中设置路由前置守卫

 1 // 设置路由的前置守卫(路由跳转之前)
 2 router.beforeEach((to, from, next) => {
 3     const name = sessionStorage.getItem("username");
 4     const token = sessionStorage.getItem("xb-token");
 5     console.log(to.name)
 6     if(to.name == 'PrescriptionHomepage'){
 7         $('.home-main').css({"background": "#000000"});
 8     }else{
 9         $('.home-main').css({"background": "#eef3f9"});
10     }
11     if (to.name === 'Login' || to.name === 'Register' || to.name === 'RegistrationAgreement' || to.name =='SignatureAgreement') {
12         next();
13     } else {
14         if (token) {
15             if (name) {
16                 next();
17             } else {
18                 router.push("/xb-login")
19             }
20         } else {
21             Message.warning('请先登录');
22             router.push("/xb-login");
23         }
24     }
25 });