新・元地方の中規模印刷会社で苦悩するWebデザイナー改めWebディレクターの日記

自由な20代、窮屈な30代を経て、遂に40代になっちまったWebディレクター&パソコン講師の覚書と思う言(こと)。略称【ちほちゅう】

*

【眼から鱗】ブラウザのキャッシュはHTMLで制御できた

   

  • このエントリーをはてなブックマークに追加

1年以上前の記事です。内容が古い可能性があります。

過去にはサイトデザインをプリントアウトしてお客様のところへもって行き、デザイン案をみてもらっていた時代もあったがさすがに今はそんなことはやらない。
仮サーバーを用意してそちらにデザインデータをアップ。直接、Web上で見てもらうのが主流。
まあ、どうしてもプリントアウトで見たいというお客様もいるにはいるのだが。。

で、Web上で見てもらうにしてもいろいろと問題点はあって、特に度々問合せが来るのが「更新されていないよ」という問合せ。
実はこれはキャッシュが悪さをしていることが殆ど。
キャッシュとは一度ダウンロードしたWebのデータ(画像、CSS等)を保管しておくスペース及びそのデータ。
同じサイトに再訪問した際、わざわざその度にインターネットからデータをダウンロードせず、一度ローカルに保存したデータを表示するというのが一般的なブラウザの仕様となっている。
そのために、たとえば画像の一部を修正したり、外部CSSの一部を修正したりした際に、更新されていないデータが表示されてしまうことがあるのだ。
で、そんなときはリロード(再読み込み)してくださいとお願いするのだがこれがちょくちょくあるのが悩みの種。

仮に、何とかしようと思っても、これはブラウザ側で設定する以外回避する方法はないのではないかと思っていた。
が、なんと、HTMLやCGI上でこれを回避するための記述があったらしい。

スポンサーリンク
 

それを解説しているのが以下のサイト。

□ ブラウザ のキャッシュを制御する/no-cache

HTMLページの場合は <head>~</head> の間に以下の3行を書きます。

<meta http-equiv=”Pragma” content=”no-cache”>
<meta http-equiv=”Cache-Control” content=”no-cache”>
<meta http-equiv=”Expires” content=”Thu, 01 Dec 1994 16:00:00 GMT”>

Perl/CGIの場合は HTTPヘッダで以下のような出力をします。

print “Content-type: text/html\n”;
print “Pragma: no-cache\n”;
print “Cache-Control: no-cache\n”;
print “Expires: Thu, 01 Dec 1994 16:00:00 GMT\n\n”;

PHP/CGIの場合は Perlと同じくHTTPヘッダに以下のような出力をします。

header(“Content-Type: text/html; charset=文字コード”);
header(“Expires: Thu, 01 Dec 1994 16:00:00 GMT”);
header(“Last-Modified: “. gmdate(“D, d M Y H:i:s”). ” GMT”);
header(“Cache-Control: no-cache, must-revalidate”);
header(“Cache-Control: post-check=0, pre-check=0”, false);
header(“Pragma: no-cache”);

ワードやエクセルファイルなどの場合は サーバの設定を変更して、HTTPヘッダを追加します。
サーバが Apache の場合は、httpd.conf で以下の設定を加えます。

<Files ~ “\.(doc|xls)$”>
Header set Pragma no-cache
Header set Cache-Control no-cache
Header set Expires “Thu, 01 Dec 1994 16:00:00 GMT”
</Files>

上記の表記をそれぞれHTMLやPerlスクリプト等に書き加えればキャッシュを無効にできるとのこと。
HTMLだけじゃなく、PerlやPHPでもできるのだが、むしろそのほうが確実かもしれない。

というのは、「Google Corme」で動作確認してみたところ、上記HTML表記ではキャッシュを無効にすることができなかったから。

上記ブログ内にも

これらの設定によってキャッシュを完全に抑止できる訳ではありません。
ブラウザの種類やバージョンやバグによって、上記の指定が無効だったり、ネットワーク上のプロキシサーバーがキャッシュしてしまったりする場合があります。

とあるように、環境に結構、左右されてしまうものらしい。

やはり、「更新されてないよ」から「リロード(再読み込み)してください」 の流れは逃れられないようだ。
ただ、夏休み中とかにこれが原因でクライアントから電話があったりするとやっぱりちょっと萎える。

 - Webデザイン, プログラミング

アドセンス広告メイン

Comment

  1. ほんじー より:

    数年前の記事ではありますが。。。

    本当の意味でキャッシュさせないのであれば、CGIを使うと可能性は上がります。

    PerlやPHPで作成した動的コンテンツであれば、同じURLでもコンテンツ内容が変化するので、プロクシサーバでも基本的にはキャッシュされません。
    ただ、動的コンテンツもキャッシュすることを試みるプロクシサーバもありますので、そのあたりがネックですね。

    POSTする値(プログラムの引数)で表示する画像が違うPHPのプログラムがあったら、キャッシュさせることなくできると思いますよ。

    もしくは、ダウンロードさせる的な感じの。

    URLも
    http://hogehoge.jp/hogeimage.php

    って感じになるので、IDとパスワードで振り分けたら、お客様にもURLを毎回伝える必要がなくなるので、いいかもしれませんね。

Message

メールアドレスが公開されることはありません。

  関連記事

jQueryスライドショー「bxSlider」のレイアウトをカスタマイズする際に注意すべきたったひとつのポイント

1年以上前の記事です。内容が古い可能性があります。なんとも有名なjQueryを使 …

FlashのActionScriptで使われる「e:Event」って表記は何?

1年以上前の記事です。内容が古い可能性があります。訓練校の生徒さんから質問があっ …

ネットメディアが間違いを犯さない理由

1年以上前の記事です。内容が古い可能性があります。以前、「日本メディアがまっぷた …

no image
この話題に関するブログ

1年以上前の記事です。内容が古い可能性があります。Yahooニュースにはizaや …

ワードプレス(WordPress)の記事に簡単に地図や動画を貼り付ける「ショートコード」 #wp

1年以上前の記事です。内容が古い可能性があります。ショートコードって知ってますか …

no image
MITライセンスのすばらしいスクリプトたち【Ajax/Javascript】

1年以上前の記事です。内容が古い可能性があります。世の中にはすばらしいフリーウェ …

DTP、Webデザインを勉強するのにおススメのテキスト【書評】

1年以上前の記事です。内容が古い可能性があります。職業訓練校で講師をやっていた経 …

no image
Safari(javascriptのバグ?)

1年以上前の記事です。内容が古い可能性があります。またまた「safari」に関し …

「tsudaる」って言葉知ってる?

1年以上前の記事です。内容が古い可能性があります。ツイッターをやっていると「ts …

no image
MacOS9の人はデザイン見本すら見れない時代

1年以上前の記事です。内容が古い可能性があります。先日、印刷物をやっているデザイ …

血液型オヤジ