首页 > 其他分享 >通过路由守卫实现免登陆

通过路由守卫实现免登陆

时间:2024-10-14 10:48:06浏览次数:11  
标签:const title 进度条 守卫 路由 登陆 import getToken NProgress

import router from './router'
import store from './store'
import { Message } from 'element-ui'
import NProgress from 'nprogress' // 进度条
import 'nprogress/nprogress.css' //进度条样式
import { getToken, setToken } from '@/utils/auth' // 存放封装好的token
import getPageTitle from '@/utils/get-page-title'//浏览器的标题

NProgress.configure({ showSpinner: false }) // 第一次进入默认为false

const whiteList = ['/login', '/auth-redirect', '/whiteList'] // 白名单

router.beforeEach(async (to, from, next) => {
  // NProgress.start(): 在路由切换开始时启动进度条。
  NProgress.start()

  // document.title = getPageTitle(to.meta.title): 根据即将访问的页面(to)的元信息(meta.title)设置文档标题。
  document.title = getPageTitle(to.meta.title)

  // const hasToken = getToken(): 检查用户是否有有效的令牌(token),以确定用户的登录状态。
  const hasToken = getToken()

  // 目标路由的查询参数中包含 token 且用

标签:const,title,进度条,守卫,路由,登陆,import,getToken,NProgress
From: https://blog.csdn.net/2301_76641758/article/details/142912440

相关文章

  • vue之间的传值问题---1路由传值router
    路由传值:query传参,刷新页面不会丢失参数。但是params会丢参的。通过路由参数传值:可以通过路由的动态参数或查询参数传递数据。在源页面设置参数,然后在目标页面通过$route.params或$route.query访问参数。1.query传参:query在浏览器地址栏中显示参数//路由{ path:'/test',......
  • 如何登陆网站后台服务器
    登录网站后台服务器通常涉及几个步骤,具体取决于你的服务器环境和配置。下面是一些常见的方法:SSH登录使用命令行工具如 ssh 连接到远程服务器。命令格式: sshusername@server_ip需要确保你的本地机器安装了SSH客户端。使用密码或密钥认证如果服务器配置了密码......
  • vue2进阶篇:vue-router之命名路由
    @目录10.6命名路由案例:将案例改为“命名路由”完整代码本人其他相关文章链接10.6命名路由注意点1:命名路由请使用name属性,替换掉path属性的作用,且name直接指定名称即可,而path必须指定3级目录(path=’/demo/test/welcome’)才行。注意点2:name属性必须包裹在<router-link>标签......
  • 云服务器Linux宝塔忘记控制台登陆信息怎么办
    如果你忘记了宝塔面板(PanelBT)在云服务器Linux系统上的登录信息,可以按照以下步骤尝试恢复:重置面板密码通过SSH登录到你的Linux服务器。执行命令 bt,进入宝塔命令行管理界面。输入数字 5 来修改面板账号密码。按照提示输入新的用户名和密码。如果SSH登录也遇到问题......
  • vue3 路由文件配置
    //通过模板路由配置import{createRouter,createWebHistory}from"vue-router";//创建路由器constroutes=[//登录路由{path:"/login",component:()=>import("../views/login/index.vue"),name:"......
  • 互联网的路由选择协议
    分层次的路由选择协议由于以下两个原因,互联网选择分层次的路由选择协议互联网的规模十分庞大,如果让每个路由器都直到所有网络应该怎样到达,处理起来的时间和资源开销太大许多单位不愿意让外界了解自己单位的网络布局细节和采用的路由选择协议,同时还希望连接到互联网上因此,把......
  • 实验项目3 自定义路由转换器
    实验目的了解Django处理HTTP请求的流程。掌握路由转换器的用法。掌握如何定义和使用自定义路由转换器。实验内容操作1 创建Django项目chapter02(先进入之前创建的虚拟环境(python3.7、有Django))操作2 在项目chapter02中创建应用app01(应用需要激活应用并分配根路由、创建子......
  • express的使用4 express路由
    前面提到的路由api可以知道啥是express路由咯~1.下面提一个不一样的路由方法,app.all()---->所有符合要求的路由中间件函数都可以经过这个方法比如:app.all('/user',(req,res,next)=>{}),所有路由开头是/user的都会进入这个方法2.express使用path-to-regexp包来匹配路由路径。......
  • 获取路由器(光猫)管理员权限
    获取路由器(光猫)管理员权限文章参考自https://www.cnblogs.com/784040932/p/5922735.html我家的光猫图片1.用光猫背后的useradmin帐号和密码登录http://192.168.1.1/2.然后在浏览器地址栏中输入http://192.168.1.1/backupsettings.conf以下载backupsettings.conf3.......
  • 宝塔面板修改端口号无法登陆解决方案
    当您在宝塔面板中修改了默认端口号后发现无法登录时,可以尝试以下几种方法来解决此问题:检查端口是否生效重启宝塔面板服务,确保新的端口设置已经生效。使用命令 netstat-an|grep端口号 检查端口是否已被占用并监听。确认防火墙设置如果服务器开启了防火墙,请确保新......