近来做项目碰到一款浏览器,因为缓存了get要求,致使不论怎样革新,数据都不更新的题目。
以下分享一下处理办法:
处理思绪就是给每一条get要求增添一个timestamp的参数,value为时候戳
然则我们又不想每次要求都加上,所以愿望全局设置。
处理方法在代码最下方
import axios from 'axios'
// import { Spin } from 'iview'
import {
getToken
} from '@/libs/util'
import Vue from 'vue'
const vueInstance = new Vue()
class HttpRequest {
constructor(baseUrl = baseURL) {
this.baseUrl = baseUrl
this.queue = {
}
}
getInsideConfig() {
const config = {
baseURL: this.baseUrl,
timeout: 60000,
headers: {
Authorization: getToken() || '',
post: {
'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8'
}
}
}
return config
}
destroy(url) {
delete this.queue[url]
}
interceptors(instance, url) {
// 要求阻拦
instance.interceptors.request.use(config => {
this.queue[url] = true
return config
}, error => {
return Promise.reject(error)
})
// 相应阻拦
instance.interceptors.response.use(res => {
this.destroy(url)
const {
data,
status
} = res
if (data.code && data.code !== 200) {
vueInstance.$Modal.error({
title: data.code,
content: data.message || data.error || '体系失足'
})
}
return {
data,
status
}
}, error => {
this.destroy(url)
return Promise.reject(error)
})
}
request(options) {
const instance = axios.create()
if (!options['method']) { //没有method的要求为get,推断为get要求
if (!options['params']) { //假如这个要求自身不带参数
Object.assign(options, { //给options这个对象增加一个params的参数,属性为timestamp,值为时候戳
params: {
timestamp: new Date().getTime()
}
})
} else {
Object.assign(options.params, { //假如get要求自身带有参数,给options.params 再增加一个key值timestamp,值为时候戳
timestamp: new Date().getTime()
})
}
}
options = Object.assign(this.getInsideConfig(), options)
this.interceptors(instance, options.url)
return instance(options)
}
}
export default HttpRequest //返回HttpRequest对象
因为时候急急,这段代码没有做太多优化,只给人人供应思绪。