解决vue项目在ie浏览器缓存问题。
ie浏览器一直是程序员的噩梦。项目在谷歌浏览器上完美运行。在ie浏览器上,缓存问题真心恶心。后台查看了资料说在接口上加上时间戳或随机数就行了。要是这样干,工作量真心大啊。后来我对我们公司大神封装的axios进行修改。
修改前POST请求:
export const postRequest = (url, params, method) => {
// debugger
//base = getCookie("server_context_gi");
// alert(`${base}${url}`);
if(method == "form") {
return axios({
method: 'post',
url: `${base}${url}`,
data: params,
transformRequest: [function(data) {
let ret = ''
for(let it in data) {
if((typeof data[it]) === 'object') {
data[it] = JSON.stringify(data[it])
}
ret += encodeURIComponent(it) + '=' + encodeURIComponent(data[it]) + '&'
}
return ret
}],
headers: {
'Content-Type': 'application/x-www-form-urlencoded'
}
});
} else if(method == "json") {
return axios({
method: 'post',
url: `${base}${url}`,
data: params,
headers: {
'Content-Type': 'application/json;charset=UTF-8'
}
});
}
}
修改后:
export const postRequest = (url, params, method) => {
//base = getCookie("server_context_gi");
// alert(`${base}${url}`);
if(method == "form") {
return axios({
method: 'post',
url: `${base}${url}`,
data: params,
transformRequest: [function(data) {
let ret = ''
for(let it in data) {
if((typeof data[it]) === 'object') {
data[it] = JSON.stringify(data[it])
}
ret += encodeURIComponent(it) + '=' + encodeURIComponent(data[it]) + '&'
}
ret = ret + 'n=' + encodeURIComponent(Math.random())
return ret
}],
headers: {
'Content-Type': 'application/x-www-form-urlencoded'
}
});
} else if(method == "json") {
if(params){
if(typeof(params)=='string'){
let p1 = JSON.parse(params);
p1['n'] = encodeURIComponent(Math.random());
params=JSON.stringify(p1);
}else{
params['n'] = encodeURIComponent(Math.random());
}
}
return axios({
method: 'post',
url: `${base}${url}`,
data: params,
headers: {
'Content-Type': 'application/json;charset=UTF-8'
}
});
}
}
修改前get请求:
export const getRequest = (url) => {
//base = getCookie("server_context_gi");
// alert(`${base}${url}`);
return axios({
method: 'get',
url: `${base}${url}`
});
} export const searchRequest = (url, params) => {
// base = getCookie("server_context_gi");
let ret = '';
for(let it in params) {
ret += encodeURIComponent(it) + '=' + encodeURIComponent(params[it]) + '&'
}
return axios({
method: 'get',
url: `${base}${url}` + "?" + ret
});
}
修改后:
export const getRequest = (url) => {
//base = getCookie("server_context_gi");
// alert(`${base}${url}`);
if(url.indexOf("?") != -1){
url = url + "&n="+encodeURIComponent(Math.random())
}else{
url = url + "?n="+encodeURIComponent(Math.random())
}
return axios({
method: 'get',
url: `${base}${url}`
});
} export const searchRequest = (url, params) => {
// base = getCookie("server_context_gi");
let ret = '';
for(let it in params) {
ret += encodeURIComponent(it) + '=' + encodeURIComponent(params[it]) + '&'
}
ret = ret + "n=" + encodeURIComponent(Math.random())
return axios({
method: 'get',
url: `${base}${url}` + "?" + ret
});
}
这样就解决了ie缓存问题,这样修改的关键点是只要修改封装的axios即可,其他的不用修改。
解决vue项目在ie浏览器缓存问题。的更多相关文章
- node-express脚手架生成的项目中实现浏览器缓存
前言: 最近在做基于 node-express 的个人站点 朵朵视野 ,在站点发布之后自己在访问测试的过程中发现站点是没有缓存机制的,这样就导致每次访问站点都需要重新去加载资源,很消耗资源以及用户体验 ...
- 如何解决vue项目中 scss 不支持 scoped 的 /deep/ 穿透写法
如何解决vue项目中 scss 不支持 scoped 的 /deep/ 穿透写法 用过vue的人估计都用过scoped样式属性,但有时候需要穿透样式,啥办? 很多资料都说用>>> 或 ...
- Vue项目添加动态浏览器头部title
0. 直接上 预览链接 + 效果图 Vue项目添加动态浏览器头部title 1. 实现思路 ( 1 ) 从路由router里面得到组件的title ( 2 ) title存vuex (本项目已经封装h ...
- vue项目强制清除页面缓存
异常描述: 支付宝中内嵌h5项目(vue框架开发),前端重新打包上传之后访问页面会导致页面空白.页面tab点击异常之类异常情况,需要手动清除支付宝缓存才可以正常访问. 解决方案: 在HTTP协议中,只 ...
- Vue项目兼容IE浏览器
转载:https://blog.csdn.net/qq_24956515/article/details/77527668 Vue项目部署到服务器后,通常除IE浏览器外其他都正常,而IE浏览器会报这么 ...
- 如何让vue项目兼容IE浏览器
一般来说项目开发到后期都需要做各种兼容性处理例如:360.IE9以上.QQ浏览器....等等 那么现在来介绍一个工具 babel-cli 跟 babel-preset-es2015 babel-cli ...
- 引用静态资源的url添加版本号,解决版本发布后的浏览器缓存有关问题
在日常的工作中,我们经常会遇到页面文件(html,jsp等)中引用的js,css,图片等被修改后,而浏览器依然缓存着老版本的文件,客户一时半会看不到修改后的效果,同时也给生产环境的版本发布带来了一些问 ...
- vue项目中阻止浏览器返回上一页
vue项目中在某个页面阻止浏览器返回上一页,适用移动端.PC端. 使用场景例如: 首页 与 A页面 来回跳转,那样点击浏览器返回时也会来回跳转,本想当页面在首页的时候就不再返回了,所以这个时候 ...
- 解决 VUE项目过大nodejs内存溢出问题
今天在启动vue项目的时候报了这样一个错误, 如图所示:频繁出现此种情况,项目太大,导致内存溢出,排除代码问题外,可参照以下方式解决 // 全局安装increase-memory-limit npm ...
随机推荐
- js的类型系统--js基于原型的基石是所有对象最终都能够类型自证
一.动态类型 变量能够类型自证的类型即为动态类型 二.基础与内置类型 三.对象与类型的关系 1.对象本身能够自证为基本类型: 2.元原型可能为一个空的集合: 3.复合对象的成员能够自证为基本类型: 4 ...
- svn命令(转)
参考资料: 1. http://os.51cto.com/art/200908/143157_all.htm2. https://www.jianshu.com/p/d3ebfa27b3ba3. ht ...
- Json提取器(Json Extractor)
Variable names:保存的变量名,后面使用${Variable names}引用 JSON Path expressions:调试通过的json path表达式 Match Numbers ...
- Json断言
Additionally assert value:添加验证的值,只有勾选了此复选框,才可以在Expected Value中设置期望的值. Match as regular expression:匹配 ...
- BZOJ 3048: [Usaco2013 Jan]Cow Lineup 双指针
看到这道题的第一个想法是二分+主席树(好暴力啊) 实际上不用这么麻烦,用一个双指针+桶扫一遍就行了 ~ code: #include <bits/stdc++.h> #define N 1 ...
- 压缩、解压命令——gzip、gunzip、tar、zip、bzip2
1.gzip命令与gunzip命令(压缩解压文件): (1)gzip——压缩: 利用touch命令创建一个文件,并向里面写入内容: 对创建的文件进行压缩: (2)解压缩gzip -d或gunzip: ...
- JavaScript兼容性问题 js兼容
1.获取事件对象: var e=e||event; 2.阻止冒泡: e:stopPropagation?e:stopPropagation():e.cancelBubble=true; 3.阻止浏览器 ...
- 浅谈LCA
目录 什么是LCA 倍增求LCA dfs bfs 树剖求LCA 什么是LCA LCA就是最近公共祖先 对于有根树\(Tree\)的两个结点\(u.v\),最近公共祖先\(LCA(T,u,v)\)表示一 ...
- KVM系统镜像制作
使用virt-install创建虚拟机并安装GuestOS virt-install是一个命令行工具,它能够为KVM.Xen或其它支持libvirt API的hypervisor创建虚拟机并完成Gue ...
- Mongoose 数据校验
什么是mongoose数据校验 用户通过mongoose给mongodb数据库增加数据的时候,对数据的合法性进行的验证 mongoose里面定义Schema:字段类型,修饰符.默认参数 .数据校验都是 ...