HTML 5アプリケーションキャッシュ
2964 ワード
HTML 5を使用すると、cache manifestファイルを作成することで、Webアプリケーションのオフラインバージョンを簡単に作成できます.
アプリケーションキャッシュ(Application Cache)とは?
HTML 5は、Webアプリケーションがキャッシュ可能であり、インターネット接続がない場合にアクセス可能であることを意味するアプリケーションキャッシュを導入している.
アプリケーション・キャッシュは、アプリケーションに3つのメリットをもたらします.
オフラインブラウズ-ユーザーは、オフラインを適用する際に使用することができる≪速度｜Velocity｜ldap≫-キャッシュされたリソースのロードが高速≪サーバー・ロードの削減｜Reduce Server Load｜Hsf≫-更新または変更されたリソースのみが、サーバーからダウンロードされます.
ブラウザのサポート
インターネットExplorerを除くすべての主流ブラウザでアプリケーションキャッシュがサポートされています.
HTML 5 Cache Manifestインスタンス
次の例では、cache manifest付きHTMLドキュメント(オフライン参照用)を示します.
≪インスタンス｜Instance｜emdw≫
みずからやってみる
Cache Manifestベース
アプリケーションキャッシュを有効にするには、ドキュメントのラベルにmanifestプロパティを含めます.
各manifestが指定されたページは、ユーザーがアクセスするときにキャッシュされます.manifestプロパティが指定されていない場合、manifestファイルで直接ページが指定されていない限り、ページはキャッシュされません.
manifestファイルの推奨ファイル拡張子は「.appcache」です.
manifestファイルには、正しいMIME-type、すなわち「text/cache-manifest」を構成する必要があります.Webサーバ上で構成する必要があります.
Manifestファイル
manifestファイルは、ブラウザにキャッシュされたコンテンツ(およびキャッシュされていないコンテンツ)を通知する簡単なテキストファイルです.
manifestファイルは3つの部分に分けられます.
CACHE MANIFEST - このタイトルの下に示すファイルは、初回ダウンロード後にキャッシュが実行される.
NETWORK - このタイトルの下に示すファイルは、サーバへの接続が必要であり、はキャッシュされません.
FALLBACK - このタイトルの下に示すファイルは、ページがアクセスできない場合のロールバックページ(例えば404ページ)を規定する.
CACHE MANIFEST
1行目、CACHE MANIFEST、必須:
上のmanifestファイルには、CSSファイル、GIF画像、JavaScriptファイルの3つのリソースがリストされています.manifestファイルがロードされると、ブラウザはWebサイトのルートディレクトリから3つのファイルをダウンロードします.その後、これらのリソースは、ユーザがいつインターネットと接続を切断しても使用可能である.
NETWORK
次のNETWORKセクションでは、ファイル「login.asp」はキャッシュされず、オフラインでは使用できません.
アスタリスクを使用して、他のすべてのリソース/ファイルにインターネット接続が必要であることを示します.
FALLBACK
次のFALLBACKセクションでは、インターネット接続が確立できない場合は、/html 5/ディレクトリ内のすべてのファイルをoffline.htmlで置き換えることを規定しています.
注記:最初のURIはリソースで、2番目は代替です.
キャッシュの更新
キャッシュが適用されると、次のような状況が発生するまでキャッシュは保持されます.
ユーザクリアブラウザキャッシュmanifestファイルが変更されました(次のヒントを参照)アプリケーションキャッシュをプログラムにより更新する.
インスタンス-完全なManifestファイル
重要なヒント:「#」で始まるのはコメント行ですが、他の用途にも対応できます.適用されたキャッシュはmanifestファイルの変更時に更新されます.画像を編集したり、JavaScript関数を変更したりした場合、これらの変更は再キャッシュされません.コメント行の日付とバージョン番号を更新することは、ブラウザがファイルを再キャッシュする方法です.
アプリケーションキャッシュに関するコメント
キャッシュされた内容に注意してください.
ファイルがキャッシュされると、ブラウザはサーバ上のファイルを変更してもキャッシュされたバージョンを表示し続けます.ブラウザがキャッシュを更新することを確認するには、manifestファイルを更新する必要があります.
注記:キャッシュ・データに対するブラウザの容量制限は異なる場合があります(一部のブラウザでは、サイトごとに5 MBの制限が設定されています).
アプリケーションキャッシュ(Application Cache)とは?
HTML 5は、Webアプリケーションがキャッシュ可能であり、インターネット接続がない場合にアクセス可能であることを意味するアプリケーションキャッシュを導入している.
アプリケーション・キャッシュは、アプリケーションに3つのメリットをもたらします.
オフラインブラウズ-ユーザーは、オフラインを適用する際に使用することができる≪速度｜Velocity｜ldap≫-キャッシュされたリソースのロードが高速≪サーバー・ロードの削減｜Reduce Server Load｜Hsf≫-更新または変更されたリソースのみが、サーバーからダウンロードされます.
ブラウザのサポート
インターネットExplorerを除くすべての主流ブラウザでアプリケーションキャッシュがサポートされています.
HTML 5 Cache Manifestインスタンス
次の例では、cache manifest付きHTMLドキュメント(オフライン参照用)を示します.
≪インスタンス｜Instance｜emdw≫
<!DOCTYPE HTML>
<html manifest="demo.appcache">
<body>
The content of the document......
</body>
</html>
みずからやってみる
Cache Manifestベース
アプリケーションキャッシュを有効にするには、ドキュメントのラベルにmanifestプロパティを含めます.
<!DOCTYPE HTML>
<html manifest="demo.appcache">
...
</html>
各manifestが指定されたページは、ユーザーがアクセスするときにキャッシュされます.manifestプロパティが指定されていない場合、manifestファイルで直接ページが指定されていない限り、ページはキャッシュされません.
manifestファイルの推奨ファイル拡張子は「.appcache」です.
manifestファイルには、正しいMIME-type、すなわち「text/cache-manifest」を構成する必要があります.Webサーバ上で構成する必要があります.
Manifestファイル
manifestファイルは、ブラウザにキャッシュされたコンテンツ(およびキャッシュされていないコンテンツ)を通知する簡単なテキストファイルです.
manifestファイルは3つの部分に分けられます.
CACHE MANIFEST - このタイトルの下に示すファイルは、初回ダウンロード後にキャッシュが実行される.
NETWORK - このタイトルの下に示すファイルは、サーバへの接続が必要であり、はキャッシュされません.
FALLBACK - このタイトルの下に示すファイルは、ページがアクセスできない場合のロールバックページ(例えば404ページ)を規定する.
CACHE MANIFEST
1行目、CACHE MANIFEST、必須:
CACHE MANIFEST
/theme.css
/logo.gif
/main.js
上のmanifestファイルには、CSSファイル、GIF画像、JavaScriptファイルの3つのリソースがリストされています.manifestファイルがロードされると、ブラウザはWebサイトのルートディレクトリから3つのファイルをダウンロードします.その後、これらのリソースは、ユーザがいつインターネットと接続を切断しても使用可能である.
NETWORK
次のNETWORKセクションでは、ファイル「login.asp」はキャッシュされず、オフラインでは使用できません.
NETWORK:
login.asp
アスタリスクを使用して、他のすべてのリソース/ファイルにインターネット接続が必要であることを示します.
NETWORK:
*
FALLBACK
次のFALLBACKセクションでは、インターネット接続が確立できない場合は、/html 5/ディレクトリ内のすべてのファイルをoffline.htmlで置き換えることを規定しています.
FALLBACK:
/html5/ /404.html
注記:最初のURIはリソースで、2番目は代替です.
キャッシュの更新
キャッシュが適用されると、次のような状況が発生するまでキャッシュは保持されます.
ユーザクリアブラウザキャッシュmanifestファイルが変更されました(次のヒントを参照)アプリケーションキャッシュをプログラムにより更新する.
インスタンス-完全なManifestファイル
CACHE MANIFEST
# 2012-02-21 v1.0.0
/theme.css
/logo.gif
/main.js
NETWORK:
login.asp
FALLBACK:
/html5/ /404.html
重要なヒント:「#」で始まるのはコメント行ですが、他の用途にも対応できます.適用されたキャッシュはmanifestファイルの変更時に更新されます.画像を編集したり、JavaScript関数を変更したりした場合、これらの変更は再キャッシュされません.コメント行の日付とバージョン番号を更新することは、ブラウザがファイルを再キャッシュする方法です.
アプリケーションキャッシュに関するコメント
キャッシュされた内容に注意してください.
ファイルがキャッシュされると、ブラウザはサーバ上のファイルを変更してもキャッシュされたバージョンを表示し続けます.ブラウザがキャッシュを更新することを確認するには、manifestファイルを更新する必要があります.
注記:キャッシュ・データに対するブラウザの容量制限は異なる場合があります(一部のブラウザでは、サイトごとに5 MBの制限が設定されています).