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. 汇编 MOV -2

    知识点:  MOV指令  基址  内联汇编  把OD附加到资源管理器右键菜单 一.MOV指令 aaa=0x889977;//MOV DWORD PTR DS:[0x403018],0x8899 ...

  2. MFC 用ShellExecute打开外部文件

    知识点: 获取CListCtrl选中文本 用ShellExecute打开外部文件 一.CListCtrl::GetFirstSelectedItemPosition CListCtrl::GetFir ...

  3. EEPROM---AT24Cxx应用介绍

    结论:1.读写AT24CXX芯片,根据容量有多种方式:一.容量为AT24C01~AT24C16,首先发送设备地址(8位地址),再发送数据地址(8位地址),再发送或者接受数据. 二.AT24C32/AT ...

  4. SpringMVC源码总结

    SpringMVC源码总结 http://blog.csdn.net/z69183787/article/details/52816927

  5. Android中级教程之----Log图文详解(Log.v,Log.d,Log.i,Log.w,Log.e)

    在Android群里,经常会有人问我,Android Log是怎么用的,今天我就把从网上以及SDK里东拼西凑过来,让大家先一睹为快,希望对大家入门Android Log有一定的帮助. android. ...

  6. dokuwiki 配置 sendmail 邮件发送

    dokuwiki 发送邮件有2种方式: 一是直接使用 PHP 自带发送功能,需要配置 PHP.ini 文件, 我没试过,可参考官网 https://www.dokuwiki.org/tips:mail ...

  7. Seay源代码审计系统的配置和安装

    2014年7月31日 Seay源代码审计系统2.1 时隔刚好一年之久,源代码审计系统再次更新,这次主要优化审计体验,优化了漏洞规则,算是小幅更新,原来使用者打开程序会提示自动更新. 1.优化原有规则, ...

  8. 11.10 Daily Scrum

    工作进度有点拖后,之后几天要加快步伐了.   Today's tasks  Next week 丁辛 餐厅列表UI设计 餐厅列表事件处理             李承晗             实现指 ...

  9. 冲刺Two之站立会议8

    今天对软件进行了用户试用,找了一些同学让他们试用软件之后对软件给出了建议,这样我们可以在一定程度上对它进行进一步地优化.

  10. 冲刺Two之站立会议5

    昨天对视频音频的内容查询收集了相关资料,今天就主要对此进行了加工.先是使两台PC进行通信,不断进行测试.改进:测试.改进.最后初见成效,但还是没有达到我们最初的标准.