[iPhone|iPad]iOSにおけるhtml5::manifestの削除について Vol.1

2011
06.02
このエントリーをはてなブックマークに追加

暑くなったり肌寒くなったりで体調を崩しそうな大阪ですが、皆様の周りは如何な具合でしょう?

 

さて、今回は結構重要な話しです。

 

今後隆盛を迎えるであろう WebApp はもちろんの事、これから先は PC ブラウザで閲覧する html5 コンテンツも快適性を追求して当たり前のように使われる事になると思われる manifest の仕様についてのレポートを作りました。

実は私は色々開発はしているものの、オフラインで動かすための manifest 指定と言うモノに少々気持ち悪さを覚えています。

理由は単純に「良く解らない」からです、これが凄く気持ち悪い。

 

manifest とは、非常に強力で有用な技術です。簡単に言えば超強力なキャッシュ機能と言うとしっくり来ますね。manifest ファイルにそのページで使われるリソースのパスを書いておくと、ローカルにそれらを保存して Web にアクセスする事無くそれらを利用する事が出来るようになります。

その性能はと言うと、大げさでも無くネイティブアプリに迫る高速読み込みが行え、おまけにオフラインでも何の問題も無いと言う高性能っぷり。

 

初めて知った時は「これはもう使うっきゃ無いよね!」と思いました、だって凄いでしょう?

所が使うに当たって当然出てくる疑問があります、それは「これってどうやって消すの?」と言うシンプルな疑問。

導入方法は数多くのサイトで語られていますが、manifest を消す方法、特に iOS では未だに確立されていません。唯一消す方法は復元を実行すると言う超力技だけと言う現状。

 

本当に消えない、と言うか消せないんです。後述しますが、私も実験中に順番を誤り個人的に所持している iPhone から二度と更新出来ない URL を作ってしまいました。

※これを回避する為の準備も紹介します、絶対にこれは守らないと泣きを見ます。

PC の方は結構なんでもありなので消せる見たいですが、我々が目を向けなければならないのは一般ユーザーの方達です。

 

例えば、こんなケースが想定出来ます。

  • 色々なサイトで manifest を使った高速ブラウジングが次々と実装される
  • ユーザーは色んなサイトを閲覧し続ける
  • なんだか iPhone/iPad の HDD 容量が凄い事になってる
  • 消せない助けて

 

如何でしょう、何とも無惨な事になると思いませんか?ここで彼等に「復元しろ」とか「初期出荷状態に戻せ」なんて言える筈ありません。

この問題の指摘は Apple 社にもメールしておこうと思います、設定の Safari から manifest を個別削除出来る機能をつけないとえらい事になるんじゃないのか?と。

 

さて、取りあえず今の所 manifest 自体は「消す事が出来ない」仕様のようなので、せめて「容量を解放する方法はあるのか?」と言う方向で検証してみましょう。

 

まず manifest を触る際に、絶対に準備しなければならない事があります。

それは Javascript による manifest のチェック機能です、これを必ず最初に作る所から始めましょう。

これが無いと、そのページを開いた瞬間「消す事が出来ないキャッシュが生成されて、以後そのキャッシュしか見ない」と言う状況が発生します。

そうです、永久にそのデバイスからはその URL の情報を更新出来なくなります。先ほど少し触れましたが、私は個人所有の実機でこれをやらかしました :(

 

Javascript ソース

1
2
3
4
5
6
7
8
9
10
var appCache = window.applicationCache;
var checkUpdate = function() {
    if(navigator.onLine) appCache.update();
    else alert('Please update for online.');
}

appCache.addEventListener('updateready', function() {
    appCache.swapCache();
    location.reload();
}, false);

html ソース

1
<input onclick="checkUpdate()" type="button" value="update" />

 

簡単に要所だけ書くとこんな感じのソースになります、ここでは挙動を調べる事に集中するので詳しい設置方法や、細かいイベントの返り値なんかは、凄く丁寧に解説して下さっているブログがあるのでそちらを参照してください。

ちなみにこの appCache.update() はロード完了後に自動的に一回だけ呼ばれますが、記事を読んでると絶対じゃないそうなので念のため適当なボタンからアップデートをチェックする関数を実装しています。

 

そして manifest ファイルを準備して html 要素に manifest=”ファイル名” を追記すれば晴れて「何度でも更新出来る manifest 付きページ」の完成です。やったね!

 

次回は実機のスクリーンショットを交えて、HDD の容量変化を見ながら実際に manifest キャッシュを行ったモノを紹介します。

 

それではまた。

 

1 | 2

 

Tags: , , ,

Your Reply