转载请注明出处:  

  项目中用到了单点登录,依赖的公司通用的jar包,且项目为前后端分离的方式,为了管理系统的所有请求和

超时管理,用到了axios,做前端请求拦截,并做管理。

  其有以下特点:

  

  axios是请求后台资源的模块,用来请求后台资源。在项目中安装的方法为,在对应的项目路径下,后dos窗口

执行以下命令:

npm install axios

  安装成功后会在项目的package.json文件中出现对象安装插件的版本:

在main.js中引用改模块:

import axios from 'axios';

  开始进行拦截请求:   

axios.interceptors.request.use((config) => {
console.info(config);
// 请求拦截
jsonp('/authStatus', null, (err, data) => {
console.info(data);
   // 请求拦截响应的参数,判断是否会话过期
if(!data.hasLogin){
     // 页面刷新跳转到登录页面
window.location.href = loginTimeOutUrl;
}
})
return config;
});

  拦截请求响应数据:

Vue.prototype.$http = axios;
axios.defaults.crossDomain = true;
axios.interceptors.response.use((response) => {
if (response && response.data) {
if (response.data.status == "UNKNOWN" || response.status == 302) {
//alert("passport登录超时,刷新重新登录");
window.location.reload();
} else {
return response;
}
} else {
return response;
}
}, function (error) {
if (302 == error.response.status || error.response.status == "UNKNOWN") {
//alert("passport登录超时,刷新重新登录");
window.location.reload();
} else {
return Promise.reject(error);
}
});
axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';

本文参考:https://www.kancloud.cn/yunye/axios/234845

vue中axios使用一:axios做拦截器的更多相关文章

  1. axios 源码解析(下) 拦截器的详解

    axios的除了初始化配置外,其它有用的应该就是拦截器了,拦截器分为请求拦截器和响应拦截器两种: 请求拦截器    ;在请求发送前进行一些操作,例如在每个请求体里加上token,统一做了处理如果以后要 ...

  2. axios源码解析 - 请求拦截器

    axios请求拦截器,也就是在请求发送之前执行自定义的函数. axios源码版本 - ^0.27.2 (源码是精简版) 平时在业务中会这样去写请求拦截器,代码如下: // 创建一个新的实例 var s ...

  3. java中过滤器(Filter)与拦截器(Interceptor )区别

    过滤器(Filter) Servlet中的过滤器Filter是实现了javax.servlet.Filter接口的服务器端程序,主要的用途是设置字符集.控制权限.控制转向.做一些业务逻辑判断等.其工作 ...

  4. Vue学习之vue中的计算属性和侦听器

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. Vue中发送ajax请求——axios使用详解

    axios 基于 Promise 的 HTTP 请求客户端,可同时在浏览器和 node.js 中使用 功能特性 在浏览器中发送 XMLHttpRequests 请求 在 node.js 中发送 htt ...

  6. 关于 Vue 中 我对中央事线管理器的(enentBus)误解

    由于这段时间公司比较闲,就对vue 中的一些模糊的点做了一些加强,突然就想到了常挂在嘴边兄弟组件传值 我理解的兄弟组件的传值是可以跨理由传值的,比如我从http://localhost:8080/lo ...

  7. spring中的监视器,过滤器,拦截器

    1.监视器 (1)首先监视器是观察者模式的实现,在我之前的博客中有关于监视器模式的解释.监视器相当于观察者 (2)我们在springMvc中最常见的监视器 ContextLoaderlistener ...

  8. 在struts2.3.4.1中使用注解、反射、拦截器实现基于方法的权限控制

    权限控制是每一个系统都应该有的一个功能,有些只需要简单控制一下就可以了,然而有些却需要进行更加深入和细致的权限控制,尤其是对于一些MIS类系统,基于方法的权限控制就更加重要了. 用反射和自定义注解来实 ...

  9. Spring3中的mvc:interceptors标签配置拦截器

    mvc:interceptors 这个标签用于注册一个自定义拦截器或者是WebRequestInterceptors. 可以通过定义URL来进行路径请求拦截,可以做到较为细粒度的拦截控制. 例如在配置 ...

随机推荐

  1. MobX入门示例

    在相当长的一段时间内,Redux 都是前端开发人员作为状态管理的首先框架,如果不会 Redux,你都不好意思跟别人说自己是搞前端的. 没过多久,开发者们开始意识到,这东西虽说盛行,但它并没有传说中的那 ...

  2. 海思3519A 开发环境设置相关

    设置板卡和虚拟机的网络参数 setenv serverip 192.168.1.107 setenv ipaddr 192.168.1.10 setenv gatewayip 192.168.1.1 ...

  3. Apache JMeter系列.1

    最爱看统计 --01-- 简介 Apache JMeter Apache JMeter可用于测试静态和动态资源(文件,Servlet,Perl脚本,Java对象,数据库和查询,FTP服务器等)的性能. ...

  4. 图论 - PAT甲级 1003 Emergency C++

    PAT甲级 1003 Emergency C++ As an emergency rescue team leader of a city, you are given a special map o ...

  5. abp记录1

    1在AbpWebApplication中的的构造函数中创建abpBootstrapper 实例,在Application_Start执行AbpBootstrapper值初始化方式 2AbpBootst ...

  6. 如果wordpress分类只有一篇文章则直接跳转到文章页

    每个项目的需求都不一样,比如最近ytkah的客户提出如果wordpress分类只有一篇文章则直接跳转到文章页,这个实现起来不会很麻烦,几行代码就能搞定,下面就来一起看看吧.打开主题的function. ...

  7. keller PAA-3XX/80794系列(绝压)压力传感器

    一.瑞士 keller(科勒)压力传感器 keller英文版通讯协议百度网盘:提取码:fusc 广播模式:所有从机都会收到上位机信息 Broadcasting This mode of communi ...

  8. template_DefaultType

    #include <iostream> using namespace std; template <typename T1,typename T2=int> class Te ...

  9. Caching POST-post是否能缓存

    https://www.mnot.net/blog/2012/09/24/caching_POST One of the changes in Apple’s release of iOS6 last ...

  10. redux的知名ppt

    https://slides.com/jenyaterpil/redux-from-twitter-hype-to-production#/20