页面嵌套 Iframe 产生缓存导致页面数据不刷新问题

摘要:
最近,我遇到了一个奇怪的问题:当多个Iframe嵌套在一个页面中时,Iframe中包含的页面无法看到最新的页面信息。初步解决方案是在Iframe所指向的页面地址后缀中添加一个随机数或时间戳。这确保了每次加载页面时,浏览器都知道它是最新的页面Ts+'“˃');但这种现象仍在继续,而且几乎崩溃。我仍然遵循这个方向,毕竟,iframe生成的缓存是根本原因。我不得不从服务器端开始,突然发现IIS似乎有一种机制可以自动保留缓存。

  最近遇到个比较古怪的问题:当页面嵌套多个 Iframe 时会出现 Iframe 里包含的页面无法看到最新的页面信息。

  初步解决方案,在 Iframe 指向的页面地址后缀添加一个随机数或者时间戳。这样能确保每次在加载页面时,让浏览器知道它是最新的页面。说白了就是欺骗下浏览器,躲过缓存的灾难。(这是从 Stack Overflow 和 CSDN 上找到一个看似可行,能彻底治根的办法。 )

  Sample Code:

  通过 JS 产生随机数,把数据数当成参数传给页面地址

<script type="text/javascript">
var randomnumber=Math.floor(Math.random()*100000);
document.write('<iframe src="http://t.zoukankan.com/xxxx.aspx?_='+randomnumber+'"></iframe>');
</script>

 通过时间戳的办法

<script>
var ts=new Date().getTime()
document.write('<iframe src="http://t.zoukankan.com/xxxx.asp?_='+ts+'"></iframe>');
document.write('<iframe src="http://t.zoukankan.com/xxxxxx.asp?_='+ts+'"></iframe>');
document.write('<iframe src="http://t.zoukankan.com/xxxxxxxx.asp?_='+ts+'"></iframe>');
</script>

但这样现象依旧,实在快崩溃了。我依旧沿着这个方向去找,毕竟 Iframe 产生缓存是根源。既然浏览器端用这种方式依旧无法解决。只好从服务器端下手了,突然灵光一现,IIS 貌似有个可以自动保留缓存的机制。

看来距离彻底治根的办法不远了。开始进入测试环境的 VM 机,把 IIS 给开起来,一开始有个配置项就吸引我了。 “HTTP 响应标头”, 因为最最最早在处理这个办法的时候就是利用 JS 来强制清除浏览器缓存(可以参考如下,虽然这个办法没根治,但应该有需要这个方法的码友)。

<META HTTP-EQUIV="pragma" CONTENT="no-cache"> 
<META HTTP-EQUIV="Cache-Control" CONTENT= "no-cache, must-revalidate"> 
<META HTTP-EQUIV="expires" CONTENT= "Wed, 26 Feb 1997 08:21:57 GMT"> 

开始配置 HTPP 响应标头。

   1. 进入 IIS ,找到传说中的 “ HTTP 响应标头”,进入 HTTP 响应标头

     页面嵌套 Iframe 产生缓存导致页面数据不刷新问题第1张

   2.添加自定义 HTTP 响应标头

   页面嵌套 Iframe 产生缓存导致页面数据不刷新问题第2张

  问题终于得到解决..

免责声明:文章转载自《页面嵌套 Iframe 产生缓存导致页面数据不刷新问题》仅用于学习参考。如对内容有疑问,请及时联系本站处理。

上篇PLSQLDeveloper12配置oracle客户端WCF RIA Services使用详解下篇

宿迁高防,2C2G15M,22元/月;香港BGP,2C5G5M,25元/月 雨云优惠码:MjYwNzM=

相关文章

浅谈大型web系统架构(一)

目录 Web前端系统 负载均衡系统 数据库集群系统 缓存系统 分布式存储系统 分布式服务器管理系统 代码发布系统   动态应用,是相对于网站静态内容而言,是指以c/c++、php、Java、perl、.net等服务器端语言开发的网络应用软件,比如论坛、网络相册、交友、BLOG等常见应用。动态应用系统通常与数据库系统、缓存系统、分布式存储系统等密不可...

js 跨域 Jquery取得iframe中元素的几种方法

http://www.jb51.net/article/34942.htm 收集利用Jquery取得iframe中元素的几种方法 : 父页面访问子页面 $(document.getElementById('tabiframe0').contentWindow.document.body).find('.subscription').text() 测可用...

iframe知识点

定义和用法(源自W3school) iframe 元素会创建包含另外一个文档的内联框架(即行内框架)。 属性:    <ifream src = "http://t.zoukankan.com/URL">  url指的是一个.html网页,这个功能是ifream的主要功能,在一个新的网页中插入引号内网页的内容,把一个网页当做另一个网页的内容。...

关于缓存的一些重要概念(Redis 前置菜)

1. 缓存的基本思想 很多朋友,只知道缓存可以提高系统性能以及减少请求相应时间,但是,不太清楚缓存的本质思想是什么。 缓存的基本思想其实很简单,就是我们非常熟悉的空间换时间。不要把缓存想的太高大上,虽然,它的确对系统的性能提升的性价比非常高。 其实,我们在学习使用缓存的时候,你会发现缓存的思想实际在操作系统或者其他地方都被大量用到。 比如CPU Cache...

Nginx作为静态web服务器——缓存原理

浏览器缓存 ​ 客户端无缓存的情况下 ​ 客户端有缓存的情况下 ​ 校验过期机制 ​ 本地客户端会检查Cache-Control(max-age)缓存是否过期,(max-age)为过期时间 Last-Modified 上次修改时间 配合If-Modified-Since或者If-Unmodified-Since使用 对比上次修改时间验证资源是否需要更...

更新js缓存办法

http://zhenggm.iteye.com/blog/680600 遇到的问题:在访问量比较大的系统中,我们需要将一些静态的文件在客户端缓存,以减少下载的流量,从而加快客户端访问的速度。但是缓存会带来一个问题,就是如何在服务端更新完文件之后,客户端能够及时得到更新。 解决思路:1. 在一个配置文件中维护js文件map; 2. 在页面中通过js ma...