首先确保我们已经设置的store.js进行值的存取,这时候我们需要配置请求和响应的拦截器设置

main.js

import Vue from 'vue'
import App from './App'
import router from './router'
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
import axios from 'axios'
// 引入store
import store from './store' // 如何localStorage的token不存在或是空跳转到路由
router.beforeEach((to, from, next) => {
if (to.path === '/') {
next();
} else {
let token = window.localStorage.token;
if (token === 'null' || token === '' || token === undefined) {
next('/');
} else {
next();
}
} }) //与后端定义状态是100签名错误 跳转到登录界面
axios.interceptors.response.use(
response => {
//当返回信息为未登录或者登录失效的时候重定向为登录页面
if (response.data.status == 100 || response.data.message == '用户未登录或登录超时,请登录!') {
router.push({
path: "/",
querry: { redirect: router.currentRoute.fullPath }//从哪个页面跳转
})
}
return response;
},
error => {
return Promise.reject(error)
}
)

  

vue配置请求拦截器和响应拦截器的更多相关文章

  1. 手把手教你vue配置请求本地json数据

    本篇文章主要介绍了vue配置请求本地json数据的方法,分享给大家,具体如下:在build文件夹下找到webpack.dev.conf.js文件,在const portfinder = require ...

  2. vue配置 请求本地json数据

    第一步:在build文件夹下找到webpack.dev.conf.js文件,在const portfinder = require('portfinder')后添加 //第一步const expres ...

  3. vue配置请求转发解决跨域问题

    通过nodejs的请求转发到后台,前端地址:http://localhost:8080   后端地址:http://localhost:8081 vue.config.js内容如下: let prox ...

  4. axios请求响应拦截器的应用

    什么是axios拦截器? 一般在使用axios时,会用到拦截器的功能,一般分为两种:请求拦截器.响应拦截器. 请求拦截器在请求发送前进行必要操作处理 例如添加统一cookie.请求体加验证.设置请求头 ...

  5. VUE 数据请求和响应(axios)

    1. 概述 1.1 简介 axios是一个基于Promise(本机支持ES6 Promise实现) 的HTTP库,用于浏览器和 nodejs 的 HTTP 客户端.具有以下特征: 从浏览器中创建 XM ...

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

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

  7. Vue添加请求拦截器

    一.现象 统一处理错误及配置请求信息 二.解决 1.安装 axios  , 命令: npm install axios --save-dev 2.在根目录的config目录下新建文件 axios.js ...

  8. 【转】AngularJs HTTP请求响应拦截器

    任何时候,如果我们想要为请求添加全局功能,例如身份认证.错误处理等,在请求发送给服务器之前或服务器返回时对其进行拦截,是比较好的实现手段. angularJs通过拦截器提供了一个从全局层面进行处理的途 ...

  9. vue中使用axios与axios的请求响应拦截

    VUE中使用Axios axios的安装 npm install axios vue-axios axios在vue的配置与使用 在main.js中引入axios和vue-axios import a ...

随机推荐

  1. pandas学习小记

    pandas操作整理 导入数据: pd.read_csv(filename):从CSV文件导入数据 pd.read_table(filename):从限定分隔符的文本文件导入数据 pd.read_ex ...

  2. 『GoLang』语法基础

    标识符 字母或下划线开头 之后只能出现数字.字母.下划线 大小写敏感 Go语言关键字 break default func interface select case defer go map str ...

  3. GUI编程笔记

    GUI编程 告诉大家该怎么学? 这是什么? 它怎么玩? 该如何去我们平时运用? 组件 窗口 弹窗 面板 文本框 列表框 按钮 图片 监听事件 鼠标 键盘事件 破解工具 1.简介 GUi的核心技术:Sw ...

  4. P5748-集合划分计数【EGF,多项式exp】

    正题 题目链接:https://www.luogu.com.cn/problem/P5748 题目大意 求将\(n\)的排列分成若干个无序非空集合的方案. 输出答案对\(998244353\)取模. ...

  5. Unity 刚体问题 解决相互作用力

    在进行开发过程中,当两个都具有碰撞体和刚体的 游戏物体进行接触之后,或多或少都会出现相互作用力,对于体验有一定的影响. 需要在FixedUpdate(间隔固定的时间调用,不受游戏帧率的影响)  当中  ...

  6. 感恩笔记之SQL查询功能最简使用模板

    感恩笔记之SQL查询功能最简使用模板 第一部分:SQL单表功能 1 语句主要关键字 SELECT --查询数据列 INTO --新建数据表 FROM --查询数据表 WHERE --筛选数据表结果 O ...

  7. iOS实现XMPP通讯(二)XMPP编程

    项目概述 这是一个可以登录jabber账号,获取好友列表,并且能与好友进行聊天的项目. 使用的是第三方库XMPPFramework框架来实现XMPP通讯. 项目地址:XMPP-Project 项目准备 ...

  8. typora博客笔记上传图片时不能显示

    前言 markdown具有轻量化.易读易写等特性,并且对于图片.超链接.图片.数学公式都有支持. 但是最近在使用Typora的过程中我发现,在写文章笔记的时候导入的图片,因为图片保存在我们电脑本地,当 ...

  9. 虚拟机Parallels Desktop 17 (PD17)支持M1 自己动手制作启动器解锁

    个人博客:xzajyjs.cn 如果自己有能力的话,直接查看这个视频即可.点此 前段时间刚出pd17,作为mac上最最强(没有之一)的虚拟机,版本17更是更进一步,性能提升极大,更是支持了Monter ...

  10. 吴恩达深度学习课后习题第5课第1周第3小节: Jazz Improvisation with LSTM

    目录 Improvise a Jazz Solo with an LSTM Network Packages 1 - Problem Statement 1.1 - Dataset What are ...