router.beforeEach(function(to,from,next){
console.log('路由拦截')
console.log(to.name)
console.log(from.name)
if(to.name=='login'){
next();
}else{
if($.cookie('userIsLogin')=='true'){
next();
}else{
next({path:'/login'});
}
}
})

 我的登录地址是login,如果userIsLogin并没有写true的话,将在点击每一个连接的时候直接跳转到登录界面,

但是如果用户直接通过连接进入,那将直接可以查看此链接的内容,并不会进行拦截。

这个时候需要在最大的组件中添加如下代码

var app = new Vue({
el: '#app',
router,
components: {Container},
mounted: function(){
if(!($.cookie('userIsLogin')=='true')){
//如果用户并未登录 直接跳转到登录界面
this.$router.push('/login')
}
}
})

或者

将路由校验放置于Vue实例之前 也是可以的

Vue router拦截 如果用户并未登录直接跳转到登录界面(最简单的cookie演示)的更多相关文章

  1. vue router拦截器的简单使用

    之前,为了实现router跳转的每个页面的url上都带上addressCode,然后用了一下router拦截器,很好用,当然也可以专门封装一个方法来实现(跳转的页面上带有addressCode),不过 ...

  2. javaweb-实现不同用户登录后跳转到不同界面

    今天下午,实现了公文流转系统的一小部分——登录界面验证不同用户跳转到不同界面 Dao package com.office.Dao; import java.sql.Connection; impor ...

  3. Laravel 登录后跳转回登录前浏览的页面

    一.经过 Auth 中间件检查后跳转至登录页面 也就是没有通过 auth 中间件的认证检查,被 auth 中间件拦截后跳转至登录页面.这种情况下,Laravel 默认会在用户登录成功后自动跳转回登录前 ...

  4. yii中登录后跳转回登录前请求的页面

    当我们请求一个经过权限控制的请求不通过时,会跳转到一个地方请求权限,请求结束后需要跳转回之前的页面.比如我们请求一个需要登录的action,会被跳转到login页面,我们希望登录成功后跳转到我们之前希 ...

  5. 怎么实现登录之后跳转到登录之前的页面?SpringMVC+Freemarker

    项目中,想实现一个功能. 直接访问某个需要登录的url,比如/addArticle,可能会跳转到登录页面login.html. 登录成功之后,自动跳转到/addArticle这个登录前的页面,继续登录 ...

  6. 登录之后跳转到登录之前的页面 之 Referer 的坑

    简而言之:通过鼠标在页面上点击链接发送请求,请求header中会包含referer信息, 通过在浏览器地址栏书写并发送请求的,header中不会有referer信息. 为了完成登录动作成功后返回原页面 ...

  7. rails登录后跳转到登录前的路径

    # 重定向到存储的地址或默认地址 def redirect_back_or(default) redirect_to(session[:forwarding_url] || default) sess ...

  8. SpringBoot 拦截器--只允许进入登录注册页面,没登录不允许查看其它页面

    SpringBoot注册登录(一):User表的设计点击打开链接 SpringBoot注册登录(二):注册---验证码kaptcha的实现点击打开链接 SpringBoot注册登录(三):注册--验证 ...

  9. VUE实现登录然后跳转到原来的页面

    可以在路由里面设置需要登录的界面,判断下没有登录就跳转到登录界面,登录了就不用登录,这里用的是一个存储的 router.beforeEach((to, from, next) => { if(t ...

随机推荐

  1. python,栈的小例子

    ''' 1.首先确认栈的概念,先进后出 2.初始化的时候如果给了一个数组那么就要将数组进栈 ''' class Stack: def __init__(self,start=[]): self.sta ...

  2. 尚硅谷Oracle教程-学习笔记2

    控制用户权限 1.创建用户 1) SQL> create user atguigu01 2 identified by atguigu01; User created 2) SQL> gr ...

  3. 【转】Python 内置函数 locals() 和globals()

    Python 内置函数 locals() 和globals() 转自: https://blog.csdn.net/sxingming/article/details/52061630 1>这两 ...

  4. Latex 问题解决

    1. 当bib文件中包含待引用的参考文献,并且在tex中正常通过\cite{}引用,却依然提示citation undefined,pdf中显示问号时,怎么解决报错. 解决:删除根目录下的  .bbl ...

  5. whistle工具全程入门

    接触过前后端开发的同学应该都了解网络请求代理工具fiddler(mac下面常用的是Charles),可以用来拦截分析请求.包装请求.本地调试和移动端代理开发调试等.多多少少,fiddler和Charl ...

  6. 关于apache配置映射端口

    step1.打开httpd.conf找到Listen 80这一行在后面添加Listen 8080Listen 8001Listen 8002Listen 8003也就是意味着每个项目占用一个端口,就像 ...

  7. 2.4G和5G的Wi-Fi各自优缺点对比

    原文地址:http://service.tp-link.com.cn/detail_article_3366.html 1.为什么5G信号的穿墙效果比2.4G信号差? 与路由器的距离相同时,5G信号相 ...

  8. node+vue报错合辑

    vue 1.This is probably not a problem with npm. There is likely additional logging output above. npm ...

  9. 在TOMCAT下配置工程的默认访问设置(转)

    对工程的部署一般是将工程的压缩文件放在tomcat安装目录的webapps下,访问时通过键入:http://localhost:8080/xx(假定为本机访问,xx是部署时的应用工程的访问名字). 而 ...

  10. FastCGI sent in stderr: "PHP Warning: simplexml_load_string(): Entity: line 1: parser error : Start tag expected, '<' not found in

    2018-4-16 17:59:03 星期一 1. 发送带有xml参数的请求时如果是用php curl, 需要将数组形式的post data 用 http_build_query() 转换 2. 接收 ...