1、main.js设置拦截器

router.beforeEach(function (to,from,next) {
if (to.meta.requireAuth) {
if (store.state.token) {
next()
} else {
next({name: 'log',query: {backUrl: to.fullPath}})
}
}else(
next()
)
})

2、路由设置

{ path: '/course',component: Course,meta: { requireAuth: true}}

3、vue页面方法设置,对应main.js设置的backUrl

login() {
this.$axios.post('api/login/',{user:this.user,pwd:this.pwd}).then(ret => {
if (ret.data.code === 1000) {
var obj = {token:ret.data.token,name:ret.data.data}
this.$store.commit('getToken',obj)
var url = this.$route.query.backUrl
if (url) {
this.$router.push({path: url})
} else {
this.$router.push({name:'home'})
} }
if (ret.data.code === 1001) {
alert('用户名或密码错误')
}
if (ret.data.code === 1002) {
alert('请求错误')
}
}).catch(ret => {
console.log(ret)
})
this.user = ''
this.pwd = '' }

「Vue」登陆-路由拦截器的更多相关文章

  1. vue中怎样实现 路由拦截器

    vue中怎样实现 路由拦截器(当用户没有登录的时候,跳转到登录页面,已经登录的时候,不能跳转到登录页,除非后台token失效) 在 我们需要实现这样 一个功能,登录拦截 其实就是 路由拦截,首先在定义 ...

  2. vue 路由拦截器和请求拦截器

    路由拦截器 已路由为导向 router.beforeEach((to,from,next)=>{ if(to.path=='/login' || localStorage.getItem('to ...

  3. Android逆向之旅---静态方式分析破解视频编辑应用「Vue」水印问题

    一.故事背景 现在很多人都喜欢玩文艺,特别是我身边的UI们,拍照一分钟修图半小时.就是为了能够在朋友圈显得逼格高,不过的确是挺好看的,修图的软件太多了就不多说了,而且一般都没有水印啥的.相比较短视频有 ...

  4. JAVAEE——SSH项目实战05:用户注册、登陆校验拦截器、员工拜访客户功能和MD5加密

    作者: kent鹏 转载请注明出处: http://www.cnblogs.com/xieyupeng/p/7170519.html 一.用户注册   显示错误信息到页面上的另一种方法: public ...

  5. (vue.js)axios interceptors 拦截器中添加headers 属性

    (vue.js)axios interceptors 拦截器中添加headers 属性:http://www.codes51.com/itwd/4282111.html 问题: (vue.js)axi ...

  6. 「Vue」起步 - vue-router路由与页面间导航

    vue-router 我们知道路由定义了一系列访问的地址规则,路由引擎根据这些规则匹配找到对应的处理页面,然后将请求转发给页进行处理.可以说所有的后端开发都是这样做的,而前端路由是不存在"请 ...

  7. vue axios请求/响应拦截器

    // main.js中配置 // 引入 axios import Axios from 'axios' // 这时候如果在其它的组件中,是无法使用 axios 命令的. // 但如果将 axios 改 ...

  8. vue使用jsx/axios拦截器设置

    最害怕的就是做过的事情,转几天又忘记了:写过的代码,也模模糊糊不知道哪里去了,所以告诉自己最好把每天遇到的问题记录下来,好,开始. 新公司要搭个vue后台框架,所以用了简简单单的 vue+iview+ ...

  9. vue页面跳转拦截器

    登录拦截逻辑 第一步:路由拦截 首先在定义路由的时候就需要多添加一个自定义字段requireAuth,用于判断该路由的访问是否需要登录.如果用户已经登录,则顺利进入路由, 否则就进入登录页面.在路由管 ...

随机推荐

  1. QTableWidget 详细使用

    QTableWidget 详细使用

  2. R实战 第八篇:重塑数据(reshape2)

    数据重塑通常使用reshape2包,reshape2包用于实现对宽数据及长数据之间的相互转换,由于reshape2包不在R的默认安装包列表中,在第一次使用之前,需要安装和引用: install.pac ...

  3. 8、Dockerfile介绍和最佳实践

    一.Dockerfile 概念 1.Dockerfile是什么 Docker 镜像是一个特殊的文件系统,除了提供容器运行时所需的程序.库.资源.配置等文件外,还包含了一些为运行时准备的一些配置参数(如 ...

  4. 如何在Windows Server 2003搭建Windows+iis+asp+access环境

    前提系统盘镜像要加载进来方案一:开始->管理您的服务器->添加或删除角色->下一步->自定义配置->下一步->选择应用程序服务器(IIS,ASP.NET)-> ...

  5. MyBatis最初的程序解读---API

    API详解:            * 线程安全问题出现的条件        (1) 只有单例对象才可能出现线程安全问题        (2) 多线程环境,即多个线程会共享这个单例对象         ...

  6. Java 面向对象之构造方法

    01构造方法引入 A:构造方法的引入 在开发中经常需要在创建对象的同时明确对象的属性值,比如员工入职公司就要明确他的姓名.年龄等属性信息. 那么,创建对象就要明确属性值,那怎么解决呢?也就是在创建对象 ...

  7. fabric-sdk-container v1.0-beta 新增支持多服务节点

    HyperLedger/Fabric SDK Docker Image 该项目在github上的地址是:https://github.com/aberic/fabric-sdk-container ( ...

  8. PHP学习 类型 变量 常数 运算符

    PHP支持下列8种类型 标量类型 scalar type整数 integer浮点数 float double布尔 boolean字符串 string 特殊类型 special typeNULL资源 r ...

  9. 基于spring框架的apache shiro简单集成

    关于项目的安全保护,我一直想找一个简单配置就能达到目的的方法,自从接触了shiro,这个目标总算达成了,以下结合我使用shiro的经验,谈谈比较轻便地集成该功能. 首先我们先了解一下shiro是什么. ...

  10. 2-Twelfth Scrum Meeting20151212

    任务安排 成员 今日完成 明日任务 闫昊 获取视频播放的进度  获取视频播放进度 唐彬 解决handler可能引起的内存泄露问题  阅读IOS代码+阅读上届网络核心代码 史烨轩 下载service开发 ...