IE浏览器中的ajax缓存问题与new Date()兼容性问题的解决方法

 1、 最近项目做兼容性测试时发现,IE11下采用ajax发送请求更新数据时页面数据始终保持不变,刷新页面也没用,退出后重新登录网站才能获得最新的数据;

 网上搜索后才发现原因是:IE浏览器中存在AJAX缓存,当请求地址和参数不变时(‘GET请求’),直接从缓存中获取数据,并不会发送请求,因此数据无法更新;POST请求因为参数发生变化了,因此能正常发送;

  解决方法就是:在每一次GET请求中加入随机数或者是当前时间作为参数,这样每次的请求不一样,就能获取到最新的数据;

但另一个问题是,项目中使用GET请求的地方太多,一个个更改效率太低;我们的项目采用的是Vue框架,请求发送是基于Vue-resource,恰好Vue-resource提供了一个拦截器inteceptor,可以用来拦截请求,对响应前后的数据做处理,因此在main.js中添加一个全局的拦截器,对项目中的所有GET请求进行统一处理:

Vue.http.interceptors.push((request, next) => {
 // console.log(this)//此处this为请求所在页面的Vue实例
 if(request.method === 'GET'){
   request.url +='?_='+new Date().getTime();
   //console.log(request);
 }
  next((response) => {
    return response;
  });
});
这样每一次的GET请求就是全新的了,IE浏览器下的数据获取与更改都正常了;


2、另一个兼容性问题是:

     使用  let st = new Date('2017-5-4 00:00:00').getTime() 获取相应的时间时,IE将返回NaN, chrome和firefox则能正常使用;原因是每个浏览器的new Date()方法允许传入的参数不一致,IE不允许采用‘ - ’的格式传入时间参数;改用‘ / ’的格式则可以兼容;因此对传入的参数做如下处理:

      let t1 = '2017-5-4 00:00:00';
      let st = Date.parse(t.replace(/-/g,"/"));

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值