最終更新:2020-05-27 (水) 10:16:26 (1428d)  

Application Cache
Top / Application Cache

オフライン時でもWebアプリケーションを使えるようにキャッシュする仕組み

https://developer.mozilla.org/ja/Offline_resources_in_Firefox

https://html.spec.whatwg.org/#appcache

ドキュメント

メモ

  • 現在進行中の 安全でない HTTP 廃止 の一環として、Firefox 60 Nightly と早期 Beta/DevEdition? では、非 HTTPS サイト上でのApplication Cache(AppCache?) の使用が許可されなくなります。
  • 無効化された場合、キャッシュマニフェストファイルは無視され window.applicationCache は undefined となります。
  • 特に大きな問題がなければ、Firefox 62ですべてのチャンネルにおいてこの変更が行われます。

利点

  • オフラインブラウジング: ユーザーがオフラインのときでも、すべてのサイトにアクセスできます。
  • 高速: キャッシュされたリソースはローカルなので、高速に読み込まれます。
  • サーバー負荷の軽減: ブラウザは、変更があったリソースのみをサーバーからダウンロードします。

チュートリアル

キャッシュマニフェストファイル

  • オフラインアクセスに備えてブラウザがキャッシュする必要があるリソースを列挙した、単純なテキストファイル
  • キャッシュファイルを更新するようにブラウザに通知するには、マニフェスト ファイルを変更する必要がある。
  • ひとつでもエラーがあると全体がキャッシュされない(構文エラー や404など)

読み込み

  • <html manifest="example.appcache">
      ...
    </html>

拡張子

MIMEタイプ

フォーマット

  • CACHE MANIFEST
    • CACHE: - 初めてダウンロードされた後、明示的にキャッシュされます。
    • NETWORK: - ユーザーがオフラインでも、これらのリソースに対するすべての要求はキャッシュをバイパスします。ワイルドカードを使用できます。
    • FALLBACK: - リソースにアクセスできない場合のフォールバック ページを指定

ツール

キャッシュの更新

  • アプリケーションがオフラインになると、次のいずれかが発生するまで、キャッシュされた状態が保たれます。
    • ユーザーがブラウザでサイトのデータ ストレージをクリアする。
    • マニフェスト ファイルが変更される。
      • ※: マニフェストに列挙されているファイルを更新しても、ブラウザはそのリソースを再キャッシュしません。マニフェスト ファイル自体を変更する必要があります。
    • アプリケーション キャッシュをプログラムで更新する。

window.applicationCache

  • window.applicationCache オブジェクトを使用すると、ブラウザのアプリケーション キャッシュにプログラムからアクセスできます。
  • プログラムでキャッシュを更新するには、まず applicationCache.update() を呼び出します。これにより、ユーザーのキャッシュの更新が試行されます(この処理のために、マニフェスト ファイルを変更しておく必要があります)。
  • 最後に、applicationCache.status が UPDATEREADY 状態の場合、applicationCache.swapCache() を呼び出すと、古いキャッシュは新しいキャッシュに置き換えられます。

Google Chrome

  • サイトのキャッシュ データは 5MB 相当に制限されます。ただし、Chromeウェブストア向けのアプリケーションを作成する場合は、unlimitedStorage を使用するとこの制限はなくなります。

参考