网页一进入判断是否登录,未登录跳转到登录页面

router.js

export default new Router({
routes: [
{
path: '/',
name: 'HelloWorld',
component: HelloWorld,
meta: {
title: '首页',
requiresAuth: true // 是否需要判断是否登录
}
},
{
path: '/login',
name: 'login',
component: login,
meta: {
title: 'login'
}
}
]
})

main.js

router.beforeEach((to, from, next) => {
if (to.meta.title) {
document.title = to.meta.title
}
// 判断该路由是否需要登录权限
if (to.matched.some(record => record.meta.requiresAuth)) {
if (to.name === 'login') {
next()
} else if (localStorage.getItem('token')) {
// 访问服务器缓存数据,判断当前token是否失效
Vue.http.get("http:xxxx/Login/UserIsLogin?token="+localStorage.getItem('token')+"&url="+to.name,{withCredentials: true}).then(response => response.json()).then(num => {
// console.log('是否登录',num);
if(num.code==1001){
next();
} else{
alert('您的token已超时,请重新登录');
next('/Login');
}
})
} else {
next('/Login')
}
} else {
next()
}
})

vue 判断是否登录,未登录跳转到登录页的更多相关文章

  1. dede用户登录时,跳转到提示页时报404错误

    做了一个项目,本地运行,用的是Apache服务器,一切正常. 可是当我把项目放到VPS中运行时,每当输入用户名登录时,调转到"成功登录,3秒钟后转向网站主页"的提示页面时,页面的顶 ...

  2. vue实现未登录跳转到登录页面

    环境:vue 2.9.3; webpack;vue-router 目的:实现未登录跳转 例子:直接在url地址栏输入...../home,但是这个页面要求需要登陆之后才能进入,判断的值就通过登陆之后给 ...

  3. vue 根据接口返回的状态码判断用户登录状态并跳转登录页,登录后回到上一个页面(http拦截器)

    背景:后台接口返回code==501表示用户是未登录状态,需要登录才可访问: 通过http拦截做路由跳转 第一步:src目录下新建http.js文件,内容如下: import Axios from ' ...

  4. Vue-router路由判断页面未登录跳转到登录页面

    router.beforeEach((to, from, next) => { if (to.matched.some(record => record.meta.requireAuth) ...

  5. vue axios封装以及登录token过期跳转问题

    Axios配置JWT/封装插件/发送表单数据 首先请务必已仔细阅读 Axios 文档并熟悉 JWT: 中文文档 JWT 中文文档 安装 npm install axios npm install es ...

  6. Vue 实现动态路由及登录&404页面跳转控制&页面刷新空白解决方案

    Vue实现动态路由及登录&404页面跳转控制&页面刷新空白解决方案   by:授客 QQ:1033553122   开发环境   Win 10   Vue 2.9.6   node-v ...

  7. Vue router拦截 如果用户并未登录直接跳转到登录界面(最简单的cookie演示)

    router.beforeEach(function(to,from,next){ console.log('路由拦截') console.log(to.name) console.log(from. ...

  8. javaweb关于用户是否登录全局判断,没有登录跳转到登录界面

    有这样一个需求,用户密码登录网站,在session中保留了用户的信息,但是用户很长时间没有再操作该界面,用户的session则被浏览器清除,而一些业务逻辑则是需要用到用户的信息,那么用户再执行操作后, ...

  9. vue路由守卫+cookie实现页面跳转时验证用户是否登录----(二)设置路由守卫

    上一篇我们已经封装好了cookie方法,登录成功之后也可以吧用户信息存到cookie中,接下来需要在router/index.js中引入一下cookie.js文件 然后继续添加以下代码 /* * be ...

随机推荐

  1. springcloud中常用的注解@

    @SpringBootApplication是springboot启动类,包括三个注解,他们的作用分别是: @Configuration:表示将该类作用springboot配置文件类 @EnableA ...

  2. LeetCode 148 Sort List 链表上的归并排序和快速排序

    Sort a linked list in O(n log n) time using constant space complexity. 单链表排序----快排 & 归并排序 (1)归并排 ...

  3. Sum vs XOR

    https://www.hackerrank.com/contests/hourrank-13/challenges/arthur-and-coprimes 要求找出所有x <= n   x + ...

  4. PHP session变量的销毁

    1.何为session? 相当于一个客户端(可以是浏览器.app.ftp等其他,而且同一个浏览器多开几个又算是不同的客户端)对服务器的一个访问,这个期间服务器为此建立一个唯一的标示(session_i ...

  5. Visual Studio中的引用项目和直接引用DLL文件

    在VS中引用类库时有多种方法,其中用的最多的就是在引用时选择项目选项卡引用本解决方案下的类库项目和选择浏览选项卡直接引用类库DLL文件,实际上这两种引用方式略有不同,今天就为大家总结下. C#本地项目 ...

  6. 使用Pycharm开发python下django框架项目生成的文件解释

    目录MyDjangoProject下表示工程的全局配置,分别为setttings.py.urls.py和wsgi.py,1.其中setttings.py包括了系统的数据库配置.应用配置和其他配置,2. ...

  7. React:关于在delegate中的confirm或者alert在多次弹出

    如何试验出是delegate的过程就不解说了 直接上解决方案:(当然我的解决方案只适合一定情况) 取比较简单的代码来解说,例如 我一开始使用delegate的原因是由于我有部分html页面是ajax中 ...

  8. 【干货】JavaScript DOM编程艺术学习笔记4-6

    四.案例研究:JavaScript图片库 js: function showPic(whichpic){ //取得链接 var source=whichpic.getAttribute("h ...

  9. Spring之IOC核心模块详解

    Spring IOC简述 IOC称为控制反转,也有一种说法叫DI(依赖注入).IOC也是spring最核心的模块,Spring的所有工作几乎都围绕着IOC展开. 什么是控制反转呢?简单的说,控制反转就 ...

  10. python 学习之FAQ:find 与 find_all 使用

      FAQ记录   1. 错误源码 错误源码如下 def fillUnivList(_html,_ulist): soup =BeautifulSoup(_html,'html.parser') fo ...