IE浏览器缓存第二次请求的解决方案

前两天在做pc端页面的时候,一个页面在IE浏览器上进行自测的时候,发现当第二次以及之后请求的参数和第一次请求的参数一致的时候,返回的数据都是一样的,在后台服务器上也没有看到请求日志,而是使用第一次请求回来的数据返回给你。那要怎么解决这个问题呢?
目前我想到4种解决方案:

1、缓存问题只是针对get请求,所以可以把get请求改为post请求

2、在请求的url地址中加入时间戳或者随机数
加入时间戳或者随机数之后,这样每次请求的地址都不一样。

let url = url + '&time=' + new Date().getTime();
或者
let url = url + '&number=' + Math.random();

api.get(url)

3、在请求头中设置Cache-Control: no-cache

XMLHttpRequest.setRequestHeader("Cache-Control","no-cache")

在后端响应头也要设置

header(“Cache-Control:no-cache,must-revalidate”);

可以参考一下这篇文章:web性能优化之:no-cache与must-revalidate深入探究
4、在请求头中设置If-Modified-Since:0

XMLHttpRequest.setRequestHeader('If-Modified-Since','0')

HTTP的请求头标签 If-Modified-Since与Last-Modified

1.基本定义
Last-Modified 与If-Modified-Since 都是标准的HTTP请求头标签,用于记录页面的最后修改时间。

2.发送方向
Last-Modified 是由服务器发送给客户端的HTTP请求头标签
If-Modified-Since 则是由客户端发送给服务器的HTTP请求头标签

3.应用场景

  • Last-Modified 在浏览器第一次请求某一个URL时,服务器端的返回状态会是200,内容是你请求的资源,同时有一个Last-Modified的属性标记此文件在服务期端最后被修改的时间,格式类似这样:
    Last-Modified: Fri, 12 May 2006 18:53:33 GMT 后面跟的时间是服务器存储的文件修改时间

  • If-Modified-Since 客户端第二次请求此URL时,根据 HTTP 协议的规定,浏览器会向服务器传送 If-Modified-Since 报头,询问该时间之后文件是否有被修改过:
    If-Modified-Since: Fri, 12 May 2006 18:53:33 GMT 后面跟的时间是本地浏览器存储的文件修改时间

如果服务器端的资源没有变化,则时间一致,自动返回HTTP状态码304(Not Changed.)状态码,内容为空,客户端接到之后,就直接把本地缓存文件显示到浏览器中,这样就节省了传输数据量。

如果服务器端资源发生改变或者重启服务器时,时间不一致,就返回HTTP状态码200和新的文件内容,客户端接到之后,会丢弃旧文件,把新文件缓存起来,并显示到浏览器中。

以上操作可以保证不向客户端重复发出资源,也保证当服务器有变化时,客户端能够得到最新的资源。

关于If-Modified-Since与Last-Modified可以参考这篇文章链接地址

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值