使用Ajax解决浏览器缓存问题

HTTP缓存

浏览器第一次向服务器发起HTTP请求，服务器会返回请求的资源，并在响应头中添加一些有关缓存的字段，如cache-control expires等，之后浏览器再向服务器请求资源就可以视情况使用缓存

HTTP缓存分类

• 强缓存：浏览器直接从本地缓存中获取数据，不与服务器打交道
• 协商缓存：浏览器发送请求到服务器，服务器判断是否可使用本地缓存

使用Ajax解决浏览器缓存问题

在一些项目中，一般提交请求都会通过ajax来提交，测试时发现，每次提交后得到的数据都是一样的，经过调试，发现问题发现在前端，没有清理缓存，所以得到的还是原来的旧数据。而我们都知道ajax能提高页面载入的速度主要的原因是通过ajax减少了重复数据的载入，也就是说在载入数据的同时将数据缓存到内存中，一旦数据被加载其中，只要我们没有刷新页面，这些数据就会一直被缓存在内存中，当我们提交 的URL与历史的URL一致时，就不需要提交给服务器，也就是不需要从服务器上面去获取数据，虽然这样降低了服务器的负载提高了用户的体验，但是我们不能获取最新的数据。为了保证我们读取的信息都是最新的，我们就需要禁止他的缓存功能。

禁止浏览器缓存功能有如下几种方法：

1. 在ajax发送请求前加上 anyAjaxObj.setRequestHeader("If-Modified-Since","0")。
2. 在ajax发送请求前加上anyAjaxObj.setRequestHeader("Cache-Control","no-cache")。
3. 在URL后面加上一个随机数："fresh=" + Math.random();。
4. 在URL后面加上时间搓："nowtime=" + new Date().getTime();。
5. 如果是使用jQuery，直接这样就可以了$.ajaxSetup({cache:false})。这样页面的所有ajax都会执行这条语句就是不需要保存缓存记录。