vue-resource拦截器interceptors使用_vueresource 拦截器

在vue项目使用vue-resource实现异步加载的过程中，需要在任何一个页面任何一次http请求过程中，增加对token过期的判断，如果token已过期，需要跳转到登录页面。如果要在每个页面中的http请求操作添加一次判断，这个工作量太大，那么需要vue-resource是否存在一个对于任何一次请求响应捕获公共回调函数
vue-resource中interceptors拦截器在每次http请求响应之后，如果设置了拦截器，会优先执行拦截器函数，获取响应体，然后才会决定是否把response返回给then进行接收。
一、安装与引用

// 安装：npm install vue-resource --save-dev
import Vue from 'vue'
// 引入资源请求插件
import VueResource from 'vue-resource'
// 使用VueResource插件
Vue.use(VueResource)

//也可以讲此写为函数，挂在但main.js中
import { modifyRequest } from '@/utils/config'
modifyRequest(Vue)
1
2
3
4
5
6
7
8
9
10

export function modifyRequest(Vue) {
	Vue.http.interceptors.push((request, next) => {
 		next((response) => {  // 在响应之后传给then之前对response进行修改		和逻辑判断。对于token已过期，就添加在此处。页面中任何一次http请求都会先调用此处方法
 		})
	})
}

1
2
3
4
5
6
7