Google App Engine で HTML5 の Application Cache

参考:

マニフェストファイルを用意する

拡張子は .appcache (.manifestから変更された)。以下サンプル。

CACHE MANIFEST
# version 1.0

CACHE:
path/to/the/file.html
/could/be/absolute/path.js

NETWORK:
always/refer/to/serverside/content.html

# external source
http://example.com/

サーバを参照するものがある場合は、必ず NETWORK に指定(CACHEで指定したもの以外はサーバを参照する、という事ではない)。

マニフェストファイルが更新されないとブラウザはキャッシュし続ける。ファイルの構成が変わらなくても更新させたい場合を考えて、コメントでバージョンとか日付とか入れておき、キャッシュを更新させる場合はここを変更する。

HTMLとJavaScript

HTMLタグにmafifest属性を追加。

<html manifest="example.appcache">

JavaScriptでキャッシュ対象のファイルがアップデートされた時に更新する。

applicationCache.addEventListener("updateready", function(){
    applicationCache.swapCache();
}, false);

GAEの設定 (app.yaml)

mime_typeを text/cache-manifestにする。以下、例。

- url: /(.*)\.appcache
  static_files: static/\1.appcache
  upload: static/(.*)\.appcache
  mime_type: text/cache-manifest
Google App Engine で HTML5 の Application Cache

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s