解决Ajax缓存问题-CSDN博客

本文探讨了Ajax开发中常见的浏览器缓存问题，并提供了多种解决策略，包括修改GET请求参数、设置HTTP头禁止缓存及使用POST请求替代GET请求。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在Ajax开发中，往往考虑更多的是用户体验，但实际中有时也会遇到浏览器缓存内容的问题，会让用户感觉是程序出错了。比如，某个元素注册了鼠标事件（onclick），事件触发后会通过 xmlhttprequest 发送请求到服务器获取内容，在不刷新页面的情况下，浏览器会缓存第一次请求的内容，服务端更新后浏览器仍然显示第一次的内容。

通常，这种请求都是 xmlhttprequest 发起的GET请求。根据 HTTP 规范，GET 用于信息获取，而且应该是幂等的。也就是说，当使用相同的 URL 重复 GET请求会返回预期的相同结果时，GET 方法才是适用的。当对一个请求有副作用的时候（例如，提交数据注册新用户时），应该使用 POST 请求而不是GET。浏览器会对GET请求做缓存处理。

解决方案：
一. GET请求URL后附加随机数或加上时间的毫秒数。，服务器将认为是不相同的请求
例 "http://www.example.com/index.php?param1=param1&param2=param2&_t=" + new Date().getTime()

二. 在ajax发送请求前加上 xmlHttpRequest.setRequestHeader("If-Modified-Since","0")

三. 在ajax发送请求前加上 xmlHttpRequest.setRequestHeader("Cache-Control","no-cache");

四. 服务端响应请求时加 header("Cache-Control: no-cache, must-revalidate"); （PHP）

五. 使用 POST 代替GET，浏览器不会对 POST 做缓存

Ajax 缓存问题