ツール開発で思いついたこと、技術的内容のまとめBlog

2014
Feb 13

ページのキャッシュコントロールを使いこなす

キャッシュについて調べる機会があったのでメモしておきます。


1.毎回サーバーにリクエストさせる場合

ログの解析などでブラウザのリクエストを収集する場合、
ブラウザにキャッシュをさせたくない場合があります。

この場合レスポンスのヘッダーに
CacheControl: no-cache

をつけることが考えられますが、
ブラウザによっては無視されてキャッシュが使用されたり、あまり有効な手段ではないようです。

そこで、実際他のサイトでよく使われている方法。
「呼び出す側(コンテンツ)のURLにクエリ文字を入れる」

これが何より手っ取り早い。
例えば、content.jsというものがあったとすれば、呼び出すURLを以下のようにする。、

content.js?[ここに一意の文字列]

異なるURLを指定することでブラウザを「騙す」わけですね。

毎回リクエストさせるためには、毎回異なる値を指定する必要があるわけで、
そうなると手動では不可能です。

JavaScriptで動的にURLを出力することを考えたくなります。

function getUID(){
    var d = new Date();
    return d.getTime()+""+Math.random();
}

上のような時間とランダム値で限りなく一意に近い値を返すような関数を作って、
これをクエリ文字に使いましょう。

ひとまず目的は果たせるはず。


2.キャッシュさせる方法

手っ取り早いのはヘッダ部分にCacheControlのmax-ageを追加する方法。

CacheControl: max-age=[秒]

Expiresヘッダを設定する方法もあるが、Expires自体HTTP1.0にしか対応していないブラウザのものなので、
CacheControl: max-ageが指定してあればほぼ事足りるらしい。

別にすべてのブラウザでキャッシュされるとは思っていないので、本サイトでは設定する手間よりも省略を選びました。


3.キャッシュさせつつ更新したタイミングを管理したい

要するに合わせ技ですね。
更新したいタイミングでクエリ文字を変える仕組みを作れば、リクエストを減らしつつキャッシュ更新を管理できます。

膨大なアクセスを処理するブラウザゲームなどで使われている手法らしいです。

最新の更新

更新情報(Atomフィード)
このエントリーをはてなブックマークに追加
カテゴリ
プロジェクト進捗

二次小説執筆

アクセスランキング