キャッシュマニフェストでキャッシュを指定する

キャッシュマニフェストとは

一度見たウェブページの内容をファイルに保存しておくことをキャッシュといいます。 キャッシュによってオフラインでもウェブサイトを閲覧できたり、再アクセスする際に素早くページを表示したりできます。

ブラウザにもキャッシュ機能はありますが、キャッシュの保存対象や削除はブラウザ側の判定になるため、期待通りのファイルを保持してくれない場合があります。

そこでキャッシュを明確に指定するのがキャッシュマニュフェストです。 キャッシュマニフェストはキャッシュしたいリソースを定義できるファイルです。 更新頻度が低いもの、重い画像、オフライン利用など目的に応じて明示的にキャッシュを指定する事ができます。

キャッシュマニフェストの作成

MIME TYPEを設定する

.htaccess などでサーバにMIME TYPEの設定をします。

ddType text/cache-manifest .appcache

HTMLタグにマニュフェスト属性を付ける

マニュフェストファイルを作成する

以下の要領でマニュフェストファイルを記述します。
なお、キャッシュを更新させたい場合は、マニュフェストファイルを変更して保存すれば更新されます。

• 一行目に「CACHE MANIFEST」
• 「CACHE:」にキャッシュしたいファイル
• 「NETWORK:」にキャッシュしたくないファイル
• 「FALLBACK:」にアクセスできなかった場合に読み込むファイル

ACHE MANIFEST 
#キャッシュ対象のパス
CACHE:
img/head.jpg
CSS/style.CSS
#キャッシュ非対象のパス
NETWORK:
js/jquery.js
#アクセスできなかった場合の代替ファイル
FALLBACK:
error.HTML