vue授权页面登陆之后返回之前的页面
import Vue from 'vue'
import Router from 'vue-router'
Vue.use(Router)
import home from "@/pages/home"
import mine from "@/pages/mine"
import login from '@/pages/login'
import register from '@/pages/register'
const router = new Router({
mode: 'history',
routes: [{
path: '/',
name: 'home',
component: home,
meta:{
homePages:true
}
},
{
path:'/home',
component:home,
meta:{
homePages:true
}
},
{
path:"/mine",
name:"mime",
component:mine,
meta:{
requiresAuth:false
}
},
{
path: '/login',
name: 'login',
component: login,
meta:{
requiresAuth:true
}
},
{
path: '/register',
name: 'register',
component: register,
meta:{
requiresAuth:true
}
},
]
});
router.beforeEach((to, from ,next) => {
const token = localStorage.getItem("token")
if(to.matched.some(record => record.meta.requireAuth || record.meta.homePages)){
//路由元信息requireAuth:true,或者homePages:true,则不做登录校验
next()
}else{
if(token){//判断用户是否登录
if(Object.keys(from.query).length === 0){//判断路由来源是否有query,处理不是目的跳转的情况
next()
}else{
let redirect = from.query.redirect//如果来源路由有query
if(to.path === redirect){//这行是解决next无限循环的问题
next()
}else{
next({path:redirect})//跳转到目的路由
}
}
}else{
if(to.path==="/login"){
next()
}else{
next({
path:"/login",
query: {redirect: to.fullPath}//将目的路由地址存入login的query中
})
}
}
}
return
})
export default router;
vue授权页面登陆之后返回之前的页面的更多相关文章
- vue滚动行为控制——页面跳转返回上一个页面保留滚动位置
需求分析: 一般这个功能在后台管理系统用的比较多,因为后台页面都是在当前页面打开,对于某些列表筛选页,如果列表数据比较多,页面就会滚动.当页面发生滚动,对列表数据进行查看或者编辑的时候,跳转到下一级页 ...
- Identity Server 4登陆后返回登录前页面
- 【flask】登陆后返回之前重定向跳转的页面
登陆后返回之前重定向跳转的页面 一.前言 实现强制跳转到登陆页面,登陆后返回之前的页面的功能.网上跳登陆页面的很多:返回之前页面功能没多少.这里我只是用了自己的方法,有缺点和其他方法也请指点!(´ε` ...
- vue的登陆验证及返回登录前页面实现
一.路由配置部分如下所示, 导出路由示例 let router = new VueRouter({ routes: [ // 登陆 { name: 'login', path: '/login', c ...
- vue keep-alive 实现详情返回列表保留页面数据
实现功能 详情页返回列表页,列表页保留上次浏览位置 其它页面进入到列表表,列表页刷新 当详情页有数据改变时,列表页也要更新该条数据 实现思路 用keep-alive保留列表页面数据 activated ...
- axios interceptors 拦截 , 页面跳转, token 验证 Vue+axios实现登陆拦截,axios封装(报错,鉴权,跳转,拦截,提示)
Vue+axios实现登陆拦截,axios封装(报错,鉴权,跳转,拦截,提示) :https://blog.csdn.net/H1069495874/article/details/80057107 ...
- vue中keepAlive的用法[返回页面不刷新]
本文转载于時間蒼白了誓言_49b9 使用vue单页开发项目时遇到一个问题:在列表页进入详情页,按返回键返回列表页时页面刷新了,用户体验非常差啊!!!查阅了一下相关问题,使用解决这个问题,下面是我的使用 ...
- 微信小程序中h5跳转到登录页面,登陆成功返回携带参数,h5刷新
公司的一个小程序,要做一个活动,需要判断登录状态. 思路:h5跳转到登录页面,登陆成功携带token自动返回. 本来以为是个非常简单的功能,没想到..... 发帖记录一下 1.登录页面 用getCur ...
- tornado web高级开发项目之抽屉官网的页面登陆验证、form验证、点赞、评论、文章分页处理、发送邮箱验证码、登陆验证码、注册、发布文章、上传图片
本博文将一步步带领你实现抽屉官网的各种功能:包括登陆.注册.发送邮箱验证码.登陆验证码.页面登陆验证.发布文章.上传图片.form验证.点赞.评论.文章分页处理以及基于tornado的后端和ajax的 ...
随机推荐
- 【BZOJ1053】[HAOI2007]反素数 (搜索+数论)
\([POI2002][HAOI2007]\)反素数 题目描述 对于任何正整数x,其约数的个数记作\(g(x)\).例如\(g(1)=1.g(6)=4\). 如果某个正整数x满足:\(g(x)> ...
- 了解一个名词——GTD
概念:就是Getting Things Done的缩写,翻译过来就是“把事情做完”,是一个管理时间的方法. 核心理念概括:就是必须记录下来要做的事,然后整理安排并使自己一一去执行. 五个核心原则是:收 ...
- VUE学习(三)语法
模板语法 Mustache 语法 1.插值 <span v-once>这个将不会改变: {{ msg }}</span> v-once,一次性,否则就会绑定 {{ }} ...
- [HAOI2011]Problem b BZOJ2301 数学
题目描述 对于给出的n个询问,每次求有多少个数对(x,y),满足a≤x≤b,c≤y≤d,且gcd(x,y) = k,gcd(x,y)函数为x和y的最大公约数. 输入输出格式 输入格式: 第一行一个整数 ...
- shell-004:检测机器存活或者网络陡动情况!
如下图情况,我们监测的就是此数据,当大于50%了,我们就可以设置告警等! #!/bin/bash # 用ping检测一台机器的存活或者网络波动情况 # 检测机器的丢包率来检测网络波动情况!! n=`p ...
- 洛谷 P2577 [ZJOI2005]午餐
这道题目比较难想. 题解: 算法:贪心+dp 容易想到贪心:吃饭慢的先打饭节约时间, 所以先将人按吃饭时间从大到小排序. 然后就是dp了: 首先,应该想到f[i][j][k]:前i个人,在1号窗口打饭 ...
- WordPress 设置GeoIP数据库目录权限时错误解决方案
存在一个问题 更新完WP-statistics后,不知道为什么出现了一个错误提示:设置GeoIP数据库目录权限时错误,请确保您的Web服务器有权限写入到目录/var/www/html/wordpres ...
- HDU - 4825 01字典树套路题
/*H E A D*/ struct Trie{ int son[maxn<<2][2]; int b[67],tot; void init(){ // memset(son,0,size ...
- C# Autofac 的 BeanFactory
using Autofac; using Microsoft.Practices.ServiceLocation; namespace Core.Common { /// <summary> ...
- 【VBA研究】Excel VBA利用ADODB访问数据库使用小结
[转自] http://blog.csdn.net/iamlaosong/article/details/18043433 作者:iamlaosong ▲连接Oracle数据库 Set cnn = C ...