炊きたてのご飯が食べたい

定時に帰れるっていいね。自宅勤務できるっていいね。子どもと炊きたてのご飯が食べられる。アクトインディでは積極的にエンジニアを募集中です。

Iframeがキャッシュを保持して更新されないときの対処法（特にChrome）

よくつまずくポイント

●top.html

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
<iframe id="testtest" src="Iframeで読み込むhtmlのURL" width="400" height="300" frameborder="0" scrolling="NO"></iframe>
</body>
</html>

●iframe.html

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
下記のスクリプトで時刻を表示
<script type="text/javascript">
dd = new Date();
document.write(dd.toLocaleString());
</script>
</body>
</html>

top.htmlでiframe.htmlをIframeで呼び出している時、いくらtop.htmlを更新してもiframe.htmlが更新されない。特にChrome！

<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Cache-Control" content="no-store">
<meta http-equiv="Cache-Control" content="no-cache">
<meta http-equiv="Expires" content="-1"></blockquote>

でキャッシュを残さないような設定をしてもダメ。

<iframe style="height:0px;width:0px;visibility:hidden" src="about:blank">
this frame prevents back forward cache
</iframe>

でSafari、Firfox対応してもダメ。 そんなときは、ｊQuery（Javascript）でiframe.htmlをリロード（reload）しちゃいましょう。 下記コードをtop.htmlに記述します。

<script>
$(document).ready(function(){
$('#testtest').each(function() {
this.contentWindow.location.reload(true);
});
});
</script>

●top.html

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script>
$(document).ready(function(){
$('#testtest').each(function() {
this.contentWindow.location.reload(true);
});
});
</script>
</head>
<body>
<iframe id="testtest" src="Iframeで読み込むhtmlのURL" width="400" height="300" frameborder="0" scrolling="NO"></iframe>
</body>
</html>