解决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 ...
随机推荐
- 对MVVM的理解
MVVM是Model-view-ViewMoudel的缩写 Model代表数据类型,也可以在Model中定义数据修改和操作的业务逻辑: View代表UI组件,负责将数据模型转化为UI展现出来: Vie ...
- 我的首次AK记
哈哈哈!本蒟蒻终于在今天中午机房测试中AK全场了(其实没啥技术含量,只有5个水题,对,全都很水)
- @EnableFeignClients 客户端详细
在Spring cloud应用中,当我们要使用feign客户端时,一般要做以下三件事情 : 1.使用注解@EnableFeignClients启用feign客户端: 示例 : @SpringBootA ...
- SQL Server Spool 假脱机
SQL Server的Spool(假脱机)操作符,用于把前一个操作符处理的数据(又称作中间结果集)存储到一个隐藏的临时结构中,以便在执行过程中重用这些数据.这个临时结构都创建在tempdb中,通常的结 ...
- MongoDB Shell db.runCommand
db.runCommand()示例 我们使用MongoDB Shell登录到mongos,添加Shard节点 [root@100 shard]# /usr/local/mongoDB/bin/mong ...
- js replace(a,b)替换指定字符
var a="aaabbb" a= a.replace("aaa", "ccc") console.log(a) //a ="c ...
- The Architectural Principles Behind Vrbo’s GraphQL Implementation
转自:https://medium.com/expedia-group-tech/graphql-component-architecture-principles-homeaway-ede8a58d ...
- 为什么学习JavaScript设计模式,因为它是核心
那么什么是设计模式呢?当我们在玩游戏的时候,我们会去追求如何最快地通过,去追求获得已什么高效率的操作获得最好的奖品:下班回家,我们打开手机app查询最便捷的路线去坐车:叫外卖时候,也会找附近最近又实惠 ...
- Java 使用 Jackson库 对 JavaMap 进行序列化反序列化
最近在用 java 处理一一些东西,发现 java 对对象进行序列化反序列化比起 python 来还是有些麻烦记录一下. 找了好几个库最后选择了 Jackson 感觉大家对它评价还不错. 将目标从 J ...
- 【Beta】Scrum meeting 6 & 助教参会记录
github 本此会议项目由PM召开,召开时间为5月13日晚上10点 召开时长15分钟 任务表格 姓名 当前任务 下阶段任务 袁勤 初步实现后端题库功能 优化后端 彭一夫 向数据库导入新题 查看评论功 ...