如何实现路由鉴权功能

什么是路由鉴权呢,分两个层面

1.如果我们还未登录的话,如果我们跳转其他路由,我们需要自动跳转到登陆页面,并且把跳转的目标路由通过query参数保留下来,点击登录之后,直接跳转过去即可

2.如果我们已经登录了,那么就不能再跳转到登录界面了,如果用户再跳转登录界面,就会自动跳转到首页

这里通过路由守卫来实现这样的效果

import router from './index'import { useUserStore } from '@/store/modules/user'//这里之所以要再次引入pinia,是因为在组件外部没办法直接获取pinia大仓库,需要手动获取
import pinia from '@/store'router.beforeEach((to: any, from: any, next: any) => {let token=useUserStore(pinia).token//用户已经登录if(token){if(to.path=='/login'){next({path:'/'})}else{next()}}else{if(to.path=='/login'){next()}else{next({path:'/login',query:{redirect:to.path}})}}
})router.afterEach((to: any, from: any) => {
})

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/630516.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

微信小程序之组件和API

学习的最大理由是想摆脱平庸,早一天就多一份人生的精彩;迟一天就多一天平庸的困扰。各位小伙伴,如果您: 想系统/深入学习某技术知识点… 一个人摸索学习很难坚持,想组团高效学习… 想写博客但无从下手,急需…

SpringBoot教程(十二) | SpringBoot集成JPA

SpringBoot教程(十二) | SpringBoot集成JPA 1. JPA简介 概念: JPA顾名思义就是Java Persistence API的意思,是JDK 5.0注解或XML描述对象-关系表的映射关系,并将运行期的实体对象持久化到数据库中。 优势: 标准化 …

京东云无线宝一代64G加速版刷机记录

文章目录 确认型号刷机环境刷机步骤遇到的坑 确认型号 请确认你的型号是:RE-SP-01B。 拆机后flash芯片型号是:winband 25Q256JVFQ 刷机环境 win11不可以,CH341A的驱动识别不到,win10可以。 刷机步骤 避免重复造轮子。 参考知…

Linux驱动学习—IIC总线之FT5X06触摸驱动实验

1、实现触摸坐标值上报 流程图&#xff1a; 设备树如下&#xff1a; 触摸设备对应的设备树节点是&#xff1a; 读取坐标的寄存器&#xff1a; #include <linux/init.h> #include <linux/module.h> #include <linux/i2c.h> #include <linux/gpio.h> #i…

spring boot学习第七篇:通过spring boot使用redis

1、pom.xml文件里面增加如下依赖&#xff1a; <dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-data-redis</artifactId> </dependency> 2、yml文件增加如下配置&#xff1a; redis:host: loc…

【不用找素材】ECS 游戏Demo制作教程(3) 1.17

一、生成墓碑 新建脚本如下&#xff1a; using Unity.Entities; using Unity.Mathematics;namespace ECSdemo {public struct GraveyardRandom : IComponentData{public Random Value;}}扩充GraveyardMono如下&#xff1a; using Unity.Entities; using Unity.Mathematics; …

【计算机硬件】3、输入输出技术、总线结构

文章目录 输入输出技术内存与接口地址的编址方法1、 内存与接口地址独立编址方法2、内存与接口地址统一编址方法 计算机和外设间的数据交互方式1、程序控制(查询)方式2、程序中断方式3、DMA方式&#xff08;直接主存存取&#xff09; 总线结构 输入输出技术 内存与接口地址的编…

【思科】IPsec VPN 实验配置(动态地址接入)

【思科】IPsec VPN 实验配置&#xff08;动态地址接入&#xff09; 注意实验需求配置思路配置命令拓扑R1基础配置配置第一阶段 IKE SA配置第二阶段 IPsec SA ISP_R2基础配置 R3基础配置配置第一阶段 IKE SA配置第二阶段 IPsec SA PCPC1PC2 检查建立成功查看命令清除IKE / IPse…

C/C++ 基本数据类型的范围

一、常见的数据类型及其范围 数据类型Size(64位)范围int4Byteunsigned int4Bytelong4Byteunsigned long4Bytelong long8Byteunsigned long long8Byte 查询Size代码&#xff1a;sizeof(类型) 查询范围代码&#xff1a;numeric_limits<类型>::max和numeric_limits<类…

django大数据_草稿本01

文档 Learning_Spark/5.Spark Streaming/ReadMe.md at master LeslieZhoa/Learning_Spark # 在pyspark下运行 from pyspark.ml.feature import HashingTF,IDF,Tokenizer # 导入相关包# 创建一个dataframe&#xff0c;toDF为定义列名 sentenceData spark.createDataFrame([(0…

数据科学与大数据导论期末复习笔记(大数据)

来自于深圳技术大学&#xff0c;此笔记涵盖了期末老师画的重点知识&#xff0c;分享给大家。 等深分箱和等宽分箱的区别&#xff1a;等宽分箱基于数据的范围来划分箱子&#xff0c;每个箱子的宽度相等。等深分箱基于数据的观测值数量来划分箱子&#xff0c;每个箱子包含相同数量…

智慧校园大数据平台架构

平台架构 基础硬件层 基础硬件层是由一组低廉的PC或服务器组合构建而成。基础硬件层主要承载着数据的存储、运算、容错、调度和通信等任务,对基础应用层下达的指令进行执行和反馈。 数据集成 大数据特征表现在实时、交互、海量等方面,并且以半结构化、非结构化数据为主,价…

支付功能的实现

1.商户调用第三方支付服务的主要步骤流程&#xff1f; 1.1 表单跳转 前端点击提交支付&#xff0c;请求后端支付接口 支付接口通过阿里api生成表单信息返回给前端页面 同步回调&#xff0c;异步回调参数 请求参数&#xff1a;总金额&#xff0c;外部订单号 公共参数&#xff1…

HarmonyOS应用开发者高级认证试题库(鸿蒙)

目录 考试链接&#xff1a; 流程&#xff1a; 选择&#xff1a; 判断 单选 多选 考试链接&#xff1a; 华为开发者学堂华为开发者学堂https://developer.huawei.com/consumer/cn/training/dev-certification/a617e0d3bc144624864a04edb951f6c4 流程&#xff1a; 先进行…

K8s(二)Pod资源——node调度策略、node亲和性、污点与容忍度

目录 node调度策略nodeName和nodeSelector 指定nodeName 指定nodeSelector node亲和性 node节点亲和性 硬亲和性 软亲和性 污点与容忍度 本文主要介绍了在pod中&#xff0c;与node相关的调度策略&#xff0c;亲和性&#xff0c;污点与容忍度等的内容 node调度策略node…

鸿蒙原生应用/元服务开发-延迟任务开发实现(二)

一、接口说明 接口名接口描述startWork(work: WorkInfo): void;申请延迟任务stopWork(work: WorkInfo, needCancel?: boolean): void;取消延迟任务getWorkStatus(workId: number, callback: AsyncCallback>): void;获取延迟任务状态&#xff08;Callback形式&#xff09;g…

2024.1.17 网络编程 作业

思维导图 练习题 广播服务器端 #include <myhead.h>int main(int argc, char const *argv[]) {//创建套接字int sfd socket(AF_INET, SOCK_DGRAM, 0);//填充网络信息结构体struct sockaddr_in cin;cin.sin_family AF_INET;cin.sin_port htons(6789);cin.sin_addr.s_…

JavaScript十大取整方法

在日常的开发过程中会有各种各样的需求会用到很多不同取整的方法&#xff0c;但是下面的这些方法中应该还是会有你没有用过的方法&#xff0c;了解一下吧。 parseInt() // js内置函数&#xff0c;注意接受参数是string&#xff0c;所以调用该方法时存在类型转换 parseInt(2.2…

Rxjava链式调用解析

本文以下面代码为例逐步解析 Observable.just("数据源").map(new Function<String, Integer>() {Overridepublic Integer apply(String s) throws Exception {return 1;}}).filter(integer -> {return integer 1;}).subscribeOn(Schedulers.io()).observe…

vue脚手架,路由,过滤器,自定义指令

● vue是单⻚⾯应⽤程序 ● 什么是路由 ○ 后端路由 ■ 对于普通的⽹站&#xff0c;所有的超链接都是URL地址&#xff0c;所有的URL地址都对应服务器上对应的资源 ○ 前端路由 ■ 对于单⻚⾯应⽤程序来说&#xff0c;主要通过URL中的hash ( # 号) 来实现不同⻚⾯之间的切换…