当前位置: 首页 > news >正文

❤ VUE3 项目路由拦截器配置(二)

❤ VUE3 项目 路由拦截器进一步 配置

路由拦截抽离为单个模块permission.ts

在这里插入图片描述

路由配置规则

白名单(直接进入)
PC页面和PC子页面(直接进入)

后台页面(验证token )
没有token=> 后台登录页面
有token=> 后台页面

import NProgress from "../progress";
import router from '../../router'
import { ElMessage } from 'element-plus' //Elmentui的提示信息NProgress.configure({ showSpinner: false }); // 显示右上角螺旋加载提示
const whiteList = ['/','/pc','/register', '/login', '/applylist', '/rules', '/pclist', '/about', '/main', '/spefevue']; //定义白名单// 路由守卫
router.beforeEach((to, from, next) => {console.log(to, from, next, '路由加载中!');NProgress.start(); //开启进度条// 将所有的Pc页面添加进入白名单---未采用// 在免登录白名单,直接进入--不检测上下级if (whiteList.indexOf(to.path) !== -1) {console.log('白名单进入!');next()} else {if(to.matched.length!=0){console.log(to.matched.map((item)=>item.name).indexOf('pc')!=-1,'循环');if(to.matched.map((item)=>item.name).indexOf('pc')!=-1){console.log('PC子页面进入!');next()}else{next('/')}}else {console.log('不在白名单-非PC页面--验证token');// 登录if (localStorage.getItem('login')) {console.log('token账号密码登录!');next(); //登录--继续} else {if (to.name == 'admin') {console.log('需要登录');next('/login')} else {console.log(localStorage.getItem('login'), '未匹配');next('/') //不满足要求重定向pc}}}}
});
router.afterEach(() => {console.log('路由加载完成!');NProgress.done(); //完成进度条
});
export { permission }

相关文章:

❤ VUE3 项目路由拦截器配置(二)

❤ VUE3 项目 路由拦截器进一步 配置 路由拦截抽离为单个模块permission.ts 路由配置规则 白名单(直接进入) PC页面和PC子页面(直接进入) 后台页面(验证token ) 没有token> 后台登录页面 有token> 后…...

Filament 如何自定义登录页面

官方的页面太简约了&#xff0c;而且可供修改的范围太少了 通过发布官方资源可以看到 resources/views/vendor/filament-panels/pages/auth/login.blade.php <x-filament-panels::page.simple>if (filament()->hasRegistration())<x-slot name"subheading&…...

百度智能云“千帆大模型平台”最新升级:接入Llama 2等33个模型!

今年3月&#xff0c;百度智能云推出“千帆大模型平台”。作为全球首个一站式的企业级大模型平台&#xff0c;千帆不但提供包括文心一言在内的大模型服务及第三方大模型服务&#xff0c;还提供大模型开发和应用的整套工具链&#xff0c;能够帮助企业解决大模型开发和应用过程中的…...

[保研/考研机试] KY129 简单计算器 浙江大学复试上机题 C++实现

描述 读入一个只包含 , -, *, / 的非负整数计算表达式&#xff0c;计算该表达式的值。 输入描述&#xff1a; 测试输入包含若干测试用例&#xff0c;每个测试用例占一行&#xff0c;每行不超过200个字符&#xff0c;整数和运算符之间用一个空格分隔。没有非法表达式。当一行中…...

推出 Elasticsearch 查询语言 (ES|QL)

作者&#xff1a;Costin Leau 我很高兴地宣布&#xff0c;经过大约一年的开发&#xff0c;Elasticsearch 查询语言 (ES|QL) 已准备好与世界共享&#xff0c;并已登陆 Elasticsearch 存储库。 ES|QL 是 Elasticsearch 原生的强大声明性语言&#xff0c;专为可组合性、表现力和速…...

机器学习 day32(神经网络如何解决高方差和高偏差)

解决高偏差和高方差的新方法 之前&#xff0c;我们需要通过选取多项式次数以及正则化参数λ&#xff0c;来平衡高方差和高偏差 只要训练集不是特别大&#xff0c;那么一个大型的神经网络总能很好的适应训练集&#xff0c;即它的Jtrain很低由此可以得出&#xff0c;若要减小Jt…...

Web前端之NodeJS、Vue

文章目录 一、Babel转码器1.1 Babel安装流程1.2 Babel命令行转码 二、Promise对象三、测试方式四、Vue&#xff08;渐进式JS框架&#xff09;4.1 准备4.2 创建一个项目4.3 运行一个项目 五、模板语法5.1 文本5.2 原始html5.3 属性Attribute5.4 使用JavaScript表达式 六、条件渲…...

冠达管理:银行定增是利好还是利空?

银行定增是指银行经过向特定投资者定向发行股票的方法进行增发。这种方法被认为可认为银行提供本钱充足、拓展融资渠道、增强抵挡危险的才能。但是&#xff0c;关于银行定增是否对商场和投资者带来积极影响的讨论一向存在。本文将从多个角度进行剖析&#xff0c;以讨论银行定增…...

背上小书包准备run之TypeScript篇

这TypeScript我真不知道面试会咋问。。。 哦以前还写过一篇基础⬇️ Typescript 基础易理解-------冲冲冲_ts和js有什么区别_慢谷的博客-CSDN博客 typescript是啥&#xff1f;与javascript的区别&#xff1f; TypeScript是一个强类型的JavaScript超集&#xff0c;可编译为纯…...

什么是绩效管理?绩效管理包括哪些内容?

阅读本文您可以了解&#xff1a;1、绩效管理的定义&#xff1b;2、绩效管理的内容&#xff1b; 一、什么是绩效管理 绩效管理是一种组织和管理方法&#xff0c;旨在确保员工的工作与组织的目标保持一致&#xff0c;以及激励和提高员工的工作表现。它涉及设定明确的目标和标准&…...

Java基础练习八(二维数组)

1.装水问题 有一个 异形 容器&#xff0c;用一个 n * n 的二维数组来表示。其中 1 表示容器实心部分&#xff0c; 0 表示空心部分。现使用此容器装水&#xff0c;能装多少水&#xff08;每个元素都表示一份水&#xff0c;只有有挡板的部分能装水&#xff09;&#xff1f; publi…...

Biopython序列比对

从InterPro网站&#xff08;https://www.ebi.ac.uk/interpro/download/Pfam/&#xff09;下载多序列比对文件Pfam-A.seed.gz&#xff08;含多个多序列比对&#xff09; ​wget https://ftp.ebi.ac.uk/pub/databases/Pfam/current_release/Pfam-A.seed.gz解压&#xff0c;取第一…...

无法坚持运动?解密肠道菌群影响运动积极性

谷禾健康 运动可以说是最有效和可行的生活方式因素&#xff0c;个人可以利用它来保护自己免受各种疾病的侵害&#xff0c;包括代谢性、心血管、神经退行性和肿瘤性疾病。 世界卫生组织建议&#xff0c;每周进行150-300分钟的中等强度运动。 运动的好处具体不用多说了&#xff0…...

4-5-tablewidget

文章目录 添加控件&#xff0c;添加行列数widget.cppwidget.h效果 添加控件&#xff0c;添加行列数 widget.cpp #include "widget.h" #include "ui_widget.h"Widget::Widget(QWidget *parent) :QWidget(parent),ui(new Ui::Widget) {ui->setupUi(this)…...

前端基础第一天-html-综合案例

通过综合案例&#xff0c;主要复习&#xff1a; 目录文件夹今日所学标签路径锚点链接 <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initia…...

PDF Expert 3.3 for mac

PDF Expert是一款专业的PDF编辑和阅读工具。它可以帮助用户在Mac、iPad和iPhone等设备上查看、注释、编辑、填写和签署PDF文档。 以下是PDF Expert的特点&#xff1a; PDF编辑&#xff1a;PDF Expert提供了丰富的PDF编辑功能&#xff0c;包括添加、删除、移动、旋转、缩放、裁…...

【腾讯云 Cloud Studio 实战训练营】深度体验 | 使用腾讯云 Cloud Studio 快速构建 Vue + Vite 完成律师 H5 页面

【腾讯云 Cloud Studio 实战训练营】深度体验 | 使用腾讯云 Cloud Studio 快速构建 Vue Vite 完成律师 H5 页面 写在前面的话一、腾讯云 Cloud Studio 介绍1.1 Cloud Studio 应用场景1.2 Cloud Studio 开发优势 二、沉浸式体验开发快速构建 H5 页面2.1 注册与登录 Cloud Studi…...

Word转PDF在线转换如何操作?分享转换技巧

现如今&#xff0c;pdf转换器已成为大家日常办公学习必不可少的工具&#xff0c;市场上的pdf转换器主要有两种类型&#xff0c;一种是需要下载安装的&#xff0c;另一种是网页版&#xff0c;打开就可以使用的&#xff0c;今天小编给大家推荐一个非常好用的网页版pdf转换器&…...

只需5步 真·双开电脑版微信

最近发现&#xff0c;有些小伙伴不仅有双开手机版微信的需求&#xff0c;同时也有电脑版的需求。 今天教大家一个方法&#xff0c;简单好用&#xff0c;只需要跟着图片操作&#xff0c;5步即可&#xff01;快一起来试试吧~ 1.下载安装ProcessExplorer 2.右键以管理员身份运行…...

如何将JSON字符串转化成对象

在这里只能使用ObjiectMapper这个类才能将Json字符串转成对象的格式进行输出 话不多说,直接上代码 实体类 //实体类 Setter Getter public class UserInfo implements Serializable {private Long id;private String name; //昵称private String phone; //手机转换代码 St…...

浏览器访问 AWS ECS 上部署的 Docker 容器(监听 80 端口)

✅ 一、ECS 服务配置 Dockerfile 确保监听 80 端口 EXPOSE 80 CMD ["nginx", "-g", "daemon off;"]或 EXPOSE 80 CMD ["python3", "-m", "http.server", "80"]任务定义&#xff08;Task Definition&…...

基于算法竞赛的c++编程(28)结构体的进阶应用

结构体的嵌套与复杂数据组织 在C中&#xff0c;结构体可以嵌套使用&#xff0c;形成更复杂的数据结构。例如&#xff0c;可以通过嵌套结构体描述多层级数据关系&#xff1a; struct Address {string city;string street;int zipCode; };struct Employee {string name;int id;…...

day52 ResNet18 CBAM

在深度学习的旅程中&#xff0c;我们不断探索如何提升模型的性能。今天&#xff0c;我将分享我在 ResNet18 模型中插入 CBAM&#xff08;Convolutional Block Attention Module&#xff09;模块&#xff0c;并采用分阶段微调策略的实践过程。通过这个过程&#xff0c;我不仅提升…...

练习(含atoi的模拟实现,自定义类型等练习)

一、结构体大小的计算及位段 &#xff08;结构体大小计算及位段 详解请看&#xff1a;自定义类型&#xff1a;结构体进阶-CSDN博客&#xff09; 1.在32位系统环境&#xff0c;编译选项为4字节对齐&#xff0c;那么sizeof(A)和sizeof(B)是多少&#xff1f; #pragma pack(4)st…...

【位运算】消失的两个数字(hard)

消失的两个数字&#xff08;hard&#xff09; 题⽬描述&#xff1a;解法&#xff08;位运算&#xff09;&#xff1a;Java 算法代码&#xff1a;更简便代码 题⽬链接&#xff1a;⾯试题 17.19. 消失的两个数字 题⽬描述&#xff1a; 给定⼀个数组&#xff0c;包含从 1 到 N 所有…...

《Playwright:微软的自动化测试工具详解》

Playwright 简介:声明内容来自网络&#xff0c;将内容拼接整理出来的文档 Playwright 是微软开发的自动化测试工具&#xff0c;支持 Chrome、Firefox、Safari 等主流浏览器&#xff0c;提供多语言 API&#xff08;Python、JavaScript、Java、.NET&#xff09;。它的特点包括&a…...

iPhone密码忘记了办?iPhoneUnlocker,iPhone解锁工具Aiseesoft iPhone Unlocker 高级注册版​分享

平时用 iPhone 的时候&#xff0c;难免会碰到解锁的麻烦事。比如密码忘了、人脸识别 / 指纹识别突然不灵&#xff0c;或者买了二手 iPhone 却被原来的 iCloud 账号锁住&#xff0c;这时候就需要靠谱的解锁工具来帮忙了。Aiseesoft iPhone Unlocker 就是专门解决这些问题的软件&…...

页面渲染流程与性能优化

页面渲染流程与性能优化详解&#xff08;完整版&#xff09; 一、现代浏览器渲染流程&#xff08;详细说明&#xff09; 1. 构建DOM树 浏览器接收到HTML文档后&#xff0c;会逐步解析并构建DOM&#xff08;Document Object Model&#xff09;树。具体过程如下&#xff1a; (…...

第25节 Node.js 断言测试

Node.js的assert模块主要用于编写程序的单元测试时使用&#xff0c;通过断言可以提早发现和排查出错误。 稳定性: 5 - 锁定 这个模块可用于应用的单元测试&#xff0c;通过 require(assert) 可以使用这个模块。 assert.fail(actual, expected, message, operator) 使用参数…...

现代密码学 | 椭圆曲线密码学—附py代码

Elliptic Curve Cryptography 椭圆曲线密码学&#xff08;ECC&#xff09;是一种基于有限域上椭圆曲线数学特性的公钥加密技术。其核心原理涉及椭圆曲线的代数性质、离散对数问题以及有限域上的运算。 椭圆曲线密码学是多种数字签名算法的基础&#xff0c;例如椭圆曲线数字签…...