vue拦截器
1、在路由添加
meta:{
requireAuth:true
}
完整
{
path: '/xx',
name: 'xx',
component: xx,
meta:{
requireAuth:true
}
},
2、在mian.js中添加
router.beforeEach(function (to, from, next) {
// to 想要去哪里
// from 从哪里来
// next 跳转到哪里
if(to.meta.requireAuth){
// 要去的url只有登陆成功后才能访问
if (store.state.token) {
next()
} else {
next({name: 'login',query: {backUrl: to.fullPath}})
}
// 没有 meta条件,直接跳转
}else{
next()
}
});
3、修改登录页面
目的:原页面->登录页面->跳转原页面
var url = that.$route.query.backUrl;
if(url){
that.$router.push({path: url})
}else{
that.$router.push({path: '/index'})
}
vue拦截器的更多相关文章
- vue拦截器Vue.http.interceptors.push
刚开始学vue,github上down了一个开源项目,看源代码的时候看到了这个地方: /** * @export * @param {any} request * @param {any} next ...
- vue拦截器实现统一token,并兼容IE9验证
项目中使用vue搭建前端页面,并通过axios请求后台api接口,完成数据交互.如果验证口令token写在在每次的接口中,也是个不小的体力活,而且也不灵活.这里分享使用vue自带拦截器,给每次请求的头 ...
- vue 拦截器
拦截器:请求发送之前和请求返回之后的处理 使用:1.config---dev.env.js 开发环境配置 2. prod.env.js 生产 API:'http://www.wpdic.com' 3. ...
- Vue 拦截器的使用
拦截器 可以全局进行拦截器设置.拦截器在发送请求前或响应返回时做一些特殊的处理. 拦截器的注册 Vue.http.interceptors.push({ request: function ( req ...
- 04 DRF内容回顾、用户登录 (含跨域) (vuex vue-cookie)、用户认证 (Auth认证)(拦截器)
1.内容回顾 1.视图中常见的继承 2.频率访问控制源码 3.序列化,反序列化 2.初始化代码 1.后端代码:AuthView (1)目录结构 (2)urls (3)view (4)注释掉cors ( ...
- vue 配置了全局的http拦截器,单独某个组件不需要这个拦截器,如何设置
之前写过关于全局配置http拦截器的随笔,现在有个需求,在微信支付时,生成二维码,页面显示一个遮罩层,二维码页面需要每两秒请求一次接口,若返回结果为已支付,则进行页面跳转,但因为全局http中load ...
- Vue添加请求拦截器
一.现象 统一处理错误及配置请求信息 二.解决 1.安装 axios , 命令: npm install axios --save-dev 2.在根目录的config目录下新建文件 axios.js ...
- vue axios拦截器 + 自编写插件 实现全局 loading 效果;
项目需求:用自定义的 .gif 图标实现全局 loading 效果:为避免在每个页面手动添加,且简单高效的实现,经查阅资料,最终采用了 vue axios拦截器 + 自编写 loading 插件:下面 ...
- vue 根据接口返回的状态码判断用户登录状态并跳转登录页,登录后回到上一个页面(http拦截器)
背景:后台接口返回code==501表示用户是未登录状态,需要登录才可访问: 通过http拦截做路由跳转 第一步:src目录下新建http.js文件,内容如下: import Axios from ' ...
随机推荐
- Linux 内核 NuBus 总线
另一个有趣的, 但是几乎被忘记的, 接口总线是 NuBus. 它被发现于老的 Mac 计算机(那 些有 M68K CPU 家族的). 所有的这个总线是内存映射的(象 M68K 的所有东西), 并且设备 ...
- ideaic快捷键
Intellij IDEA中有很多快捷键让人爱不释手,stackoverflow上也有一些有趣的讨论.每个人都有自己的最爱,想排出个理想的榜单还真是困难.以前也整理过Intellij的快捷键,这次就按 ...
- Java虚拟机-类文件结构
目录 类文件结构 Class类文件的结构 魔数与Class文件的版本 常量池 访问标志 类索引.父类索引和接口索引集合 字段表集合 方法表集合 属性表集合 完整结构描述 实例 源码 Class文件 分 ...
- 19.yield和send的区别
转载:https://www.jianshu.com/p/ccb5e7da3fd8 https://www.cnblogs.com/xhcdream/p/8304953.html https://ww ...
- zabbix安装完成后查看编译参数
最近学习zabbix分布式监控系统,突然想如何查看自己编译时的参数,最终找到自己想要的结果. 1.首先进入zabbix源码目录 2.用ls -l命令查看是否有一个叫config.log文件 3.这个文 ...
- 【C++】递归 课后习题3-13、3-14
// // main.cpp // 3-13递归Fibonacci级数 // // Created by T.P on 2018/3/21. // Copyright © 2018年 T.P. All ...
- 「Main」
这里就是我的小主页辣. My Introduction I am Louch. 姓名:楼翰诚 性别:汉纸 生日:2004/03/09(和加加林同一天呢QAQ) 星座:双鱼座 学校:义乌中学 QQ:10 ...
- Python基础复习面向对象篇
目录 类与对象的概念 实例方法 实例变量 初始化方法 析构方法 常用内置方法 继承 类方法与静态方法 动态扩展类与实例 @property装饰器 概述 面向对象是当前流行的程序设计方法,其以人类习惯的 ...
- swoole通往大神之路——swoole任务中心说明及进程任务架构搭建
Swoole多任务处理中心 如果你还不会用swoole就out了,swoole通往大神之路——swoole任务中心说明及进程任务架构搭建 教学视频: www.bilibili.com/video/av ...
- Spring Security 实战干货: 简单的认识 OAuth2.0 协议
1.前言 欢迎阅读 Spring Security 实战干货 系列文章 .OAuth2.0 是近几年比较流行的授权机制,对于普通用户来说可能每天你都在用它,我们经常使用的第三方登录大都基于 OAuth ...