IE下Ajax缓存问题的解决办法

最新推荐文章于 2023-08-11 15:05:15 发布

最新推荐文章于 2023-08-11 15:05:15 发布 · 139 阅读

文章标签：

#IE #Ajax #Cache #JavaScript #XML #ViewUI

Struts2 专栏收录该内容

5 篇文章

订阅专栏

本文介绍了在使用IE浏览器时遇到的Ajax缓存问题及解决方案。通过修改Ajax请求方式、添加随机数参数或设置HTTP头部信息等方法，有效避免了缓存导致的数据不更新现象。

今天下午在做要素页面无刷新添加的时候，IE下遭遇Ajax缓存戏弄，因为刚开始并不知道IE有这个坏毛病，折腾了我一下午，终于解决问题。郁闷之余，总结一下解决办法：
在IE下用Ajax请求某一页面，通常会因为缓存的原因而返回上一次的结果，造成混乱，而FF下不会出现这种情况。为了不受缓存影响，可以这样做：

IE访问策略：Internet选项--浏览历史记录--设置-- Internet 临时文件的选项改为每次访问网页时也可以

1: 在AJAX请求的页面后加个随机函数,我们可以使用随机时间函数

在javascript发送的URL后加上t=Math.random()
例如这样:URL+"&"+"t="+Math.random();或者new Date();

2: 在XMLHttpRequest发送请求之前加上XMLHttpRequest.setRequestHeader("If-Modified-Since","0")

一般情况下,这里的XMLHttpRequest不会直接使用
你应该可以找到这样的代码
XXXXX.send(YYYYYY);
那么,就把它变成
XXXXX.setRequestHeader("If-Modified-Since","0");
XXXXX.send(YYYYYY);
实践证明，两种方法都非常有效。
1、在服务端加 header("Cache-Control: no-cache, must-revalidate");
2、在ajax发送请求前加上 xmlHttpRequest.setRequestHeader("If-Modified-Since","0");
3、在ajax发送请求前加上 xmlHttpRequest.setRequestHeader("Cache-Control","no-cache");
4、在 Ajax 的 URL 参数后加上 "?fresh=" + Math.random(); //当然这里参数 fresh 可以任意取了
5、第四种方法和第三种类似，在 URL 参数后加上 "?timestamp=" + new Date().getTime(); //推荐使用这种方式
6、用POST替代GET：不推荐

Struts2 Server端用法

<package name="json-nocache" extends="json-default">
	<interceptors>
		<interceptor name="cachingHeadersInterceptor" class="com.ssa.pct.web.interceptor.CachingHeaderInterceptor" />
		<interceptor-stack name="defaultSecurityStack">
			<interceptor-ref name="defaultStack" />
			<interceptor-ref name="cachingHeadersInterceptor" />
		</interceptor-stack>
	</interceptors>

	<default-interceptor-ref name="defaultSecurityStack" />
</package>

public class CachingHeaderInterceptor extends AbstractInterceptor {

	private static final long serialVersionUID = 1L;

	public String intercept(ActionInvocation invocation) throws Exception {
		ActionContext context = invocation.getInvocationContext();
		HttpServletResponse response = (HttpServletResponse) context.get(StrutsStatics.HTTP_RESPONSE);
		if (response != null) {
			response.setHeader("Cache-Control", "no-cache");
			response.setHeader("Pragma", "no-cache");
			response.setHeader("Expires", "-1");
		}
		return invocation.invoke();
	}

}