vue配置请求拦截器和响应拦截器
首先确保我们已经设置的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配置请求拦截器和响应拦截器的更多相关文章
- 手把手教你vue配置请求本地json数据
本篇文章主要介绍了vue配置请求本地json数据的方法,分享给大家,具体如下:在build文件夹下找到webpack.dev.conf.js文件,在const portfinder = require ...
- vue配置 请求本地json数据
第一步:在build文件夹下找到webpack.dev.conf.js文件,在const portfinder = require('portfinder')后添加 //第一步const expres ...
- vue配置请求转发解决跨域问题
通过nodejs的请求转发到后台,前端地址:http://localhost:8080 后端地址:http://localhost:8081 vue.config.js内容如下: let prox ...
- axios请求响应拦截器的应用
什么是axios拦截器? 一般在使用axios时,会用到拦截器的功能,一般分为两种:请求拦截器.响应拦截器. 请求拦截器在请求发送前进行必要操作处理 例如添加统一cookie.请求体加验证.设置请求头 ...
- VUE 数据请求和响应(axios)
1. 概述 1.1 简介 axios是一个基于Promise(本机支持ES6 Promise实现) 的HTTP库,用于浏览器和 nodejs 的 HTTP 客户端.具有以下特征: 从浏览器中创建 XM ...
- vue axios请求/响应拦截器
// main.js中配置 // 引入 axios import Axios from 'axios' // 这时候如果在其它的组件中,是无法使用 axios 命令的. // 但如果将 axios 改 ...
- Vue添加请求拦截器
一.现象 统一处理错误及配置请求信息 二.解决 1.安装 axios , 命令: npm install axios --save-dev 2.在根目录的config目录下新建文件 axios.js ...
- 【转】AngularJs HTTP请求响应拦截器
任何时候,如果我们想要为请求添加全局功能,例如身份认证.错误处理等,在请求发送给服务器之前或服务器返回时对其进行拦截,是比较好的实现手段. angularJs通过拦截器提供了一个从全局层面进行处理的途 ...
- vue中使用axios与axios的请求响应拦截
VUE中使用Axios axios的安装 npm install axios vue-axios axios在vue的配置与使用 在main.js中引入axios和vue-axios import a ...
随机推荐
- P4590-[TJOI2018]游园会【dp套dp】
正题 题目链接:https://www.luogu.com.cn/problem/P4590 题目大意 给出一个长度为\(m\)的字符串\(s\). 对于每个\(k\in[0,m]\)求有多少个长度为 ...
- Docker安装Jenkins 从GitLab上拉取代码打包SpringBoot项目并部署到服务器
1. 安装Jenkins 采用 Docker 方式安装 jenkins 首先,宿主机上需要安装java和maven,这里我的安装目录如下: 由于是docker安装,jenkins将来是在容器里面运行 ...
- Redis之品鉴之旅(三)
3)Set,可以去重的.无序的集合.可以取交集.并集.zset(sorted set),有序的.去重的集合,排序不是根据value排序,而是根据score排序. using (RedisClient ...
- ☠全套Java教程_Java基础入门教程,零基础小白自学Java必备教程👾#010 #第十单元 Scanner类、Random类 #
一.本单元知识点概述 (Ⅰ)知识点概述 二.本单元教学目标 (Ⅰ)重点知识目标 1.API的使用2.Scanner类的使用步骤3.Random类的使用 (Ⅱ)能力目标 1.掌握API的使用步骤2.使用 ...
- MyBatis-Plus——实践篇
MyBatis-Plus--实践篇 MyBatis-Plus (简称 MP)是一个 MyBatis的增强工具,在 MyBatis 的基础上只做增强不做改变,为简化开发.提高效率而生.进行数据库操作常用 ...
- SPA测试
1.生产端:环境准备为了进行SPA测试,在生产数据库中创建了SPA测试专用用户,避免与其他用户相互混淆与可能产生的误操作. CREATE USER SPA IDENTIFIED BY SPA DEFA ...
- TWAIN-v2.4-说明文档翻译(1)介绍
介绍 Introduction 一致性需求(Need for Consistency) 对于扫描仪,数字摄像仪,以及其他图像获取设备,用户渴望发现将图像合并到他们的文档以及其他工作的价值.然而,支持展 ...
- springcloud组件之hystrix服务熔断,降级,限流
hystrix 简介 Hystrix是什么 在分布式环境中,许多服务依赖项中的一些必然会失败.Hystrix是一个库,通过添加延迟容忍和容错逻辑,帮助你控制这些分布式服务之间的交互.Hystrix通过 ...
- 面试官:为什么需要Java内存模型?
面试官:今天想跟你聊聊Java内存模型,这块你了解过吗? 候选者:嗯,我简单说下我的理解吧.那我就从为什么要有Java内存模型开始讲起吧 面试官:开始你的表演吧. 候选者:那我先说下背景吧 候选者:1 ...
- jenkins容器内安装python3
前言 很多小伙伴可能在考虑 jenkins 拉取了 github 上的代码后,发现还越少 python3 环境,那能怎么办呢? 咨询了一位运维朋友给我的答案是,将 python3 挂载到容器工作目录上 ...