PC | mobile ver.20170108.

 libro ~入門ドキュメント・サイト~

JavaScriptによるHTML5プログラミング入門:

アプリケーションキャッシュ (1/5)

作成:2012-04-16 07:47
更新:2012-04-16 07:47
■アプリケーションキャッシュの基本的な仕組み
HTML5では、オフラインで動くWebアプリケーションを作成するための機能がいろいろと追加されています。WebストレージIndexed Databaseのようにローカル環境にデータを保管する機能や、File APIのようにローカル環境でのファイル利用に関する機能などですね。しかし、こうしたものを使っても、まだ解消できない問題があります。それは「表示するHTML自身は、やっぱりサーバーにアクセスして取ってこないといけない」ということです。

この問題を解消すべく用意されることになったのが「アプリケーションキャッシュ」機能です。これは、HTMLやイメージファイルなど、Webで使われる各種のファイル類をローカル環境にキャッシュし、以後はそのサイトにアクセスするときはキャッシュされた内容をロードして表示するようにしてしまう機能です。これを利用すれば、最初の1度だけWebサーバーにアクセスすれば、以後はネットに繋がらなくてもWebページを利用可能になります。

このアプリケーションキャッシュは、利用は非常に簡単です。が、実はちょっと難しいです。――つまりですね、Webページに「このページはキャッシュするぞ」ということを設定するのはとても簡単なのです。ただし、そのために、キャッシュに関する設定ファイルを用意してやらないといけません。これが、ちょっとだけ面倒くさい。更に、この設定ファイルをサーバーが認識するように設定変更してやらないといけません。これが、サーバー設定の経験がない人にはかなり難しそうに見えるでしょう。この「準備の部分」が、ちょっと難しそうなのです。が、それさえできれば、利用は実に簡単です。


■Apacheサーバーの設定

まずは、サーバーの設定について説明しておきましょう。アプリケーションキャッシュでは、設定ファイルを用意して、それを元にキャッシュが設定されるのですが、この設定ファイルをWebサーバーからWebブラウザへときちんとした形で送信されるようにしておくためには、「この種類のファイルはこういうデータ形式のものとして扱います」ということをサーバーに設定してやらないといけません。

例えば、.htmlという拡張子のものはHTMLのソースコードが書いてあるものですよ、ということがわかるのは、WebサーバーとWebブラウザの間で.htmlというファイルに関する情報がきちんと受け渡しできているからです。同じように、アプリケーションキャッシュの設定ファイルもきちんと情報が受け渡されるようにしておく必要があります。

設定ファイルは、通常「.manifest」とか「.mf」あるいは「.appcache」といった拡張子のファイルとして使用されます。以前は.manifestなどが多用されていましたが、これは他でもけっこう使われている拡張子ですから万が一、全然別のファイルが認識されたりすると困ります。そこで「.appcache」という拡張子を用いることが一般的になってきています。

Webサーバーでもっとも広く用いられているのはApache HTTP Serverですが、このサーバーではディレクトリ内に設定ファイルを用意しておくだけで、サーバーの設定を変更することができます。アプリケーションキャッシュを利用するWebページのファイルが配置されているところに「.htaccess」という名前のテキストファイルを用意し、そこに以下の文を記述してください。
AddType text/cache-manifest .appcache
これで、そのディレクトリにアクセスすると、「.appcache」という拡張子のファイルをアプリケーションキャッシュの設定ファイルとして認識するようになります。まずは、この設定をおこなっておきましょう。


 

※プログラムリストが表示されない場合

AddBlockなどの広告ブロックツールがONになっていると、プログラムリスト等が表示されない場合があります。これらのツールをOFFにしてみてください。


 


「JavaScriptによるHTML5プログラミング入門」に戻る



※その他のコンテンツ