2

HTML5オフラインキャッシュがどのように機能するかを把握しようとしています。私はさまざまなチュートリアルを読みましたが、それらはすべて、マニフェストファイルがどのように見えるかについて小さなバリエーションがあります。次のようなキャッシュマニフェストを使用してページを設定します。

CACHE MANIFEST
index.html
Icon.jpg

これを含む.htaccessファイル

AddType text/cache-manifest .manifest

そしてこのようなindex.htmlページ:

<!DOCTYPE HTML>
<html manifest="cache.manifest">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1.0, maximum-scale=1.0"/>
<meta name="apple-mobile-web-app-capable" content="yes" />

<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<link rel="apple-touch-icon" href="Icon.jpg"/>

<script>
cache = window.applicationCache;

cache.onchecking = function()
{
statBar.innerHTML="Status: Checking";
}

cache.ondownloading= function() 
{
statBar.innerHTML="Status: Downloading";
}


cache.oncached = function() 
{
statBar.innerHTML="Status: Cached:";
}

cache.onerror =  function() 
{
statBar.innerHTML='Status: An Error ocurred.';
}

cache.onupdateready= function()
{
statBar.innerHTML='Updated';
}

cache.onprogress= function()
{
statBar.innerHTML = statBar.innerHTML + "Progress!";
}

</script>
<title>New Web Project</title>
</head>
<body>
<h1>New Web Project Page</h1>

<div id="statBar">Status:</div>
<script>
statBar = document.getElementById("statBar");
</script>
</body>
</html>

FireFoxでは、チェック、ダウンロード、進行状況、キャッシュの順に表示されますが、firebugアドオンを使用すると、「アプリケーションキャッシュに0個のアイテム」と表示されます。また、ステータスは2(UNCACHED)と表示されます。再度アクセスすると、チェック状態のままになり、ステータスがアイドルとして表示されます。

Safari for iOSでは、[ダウンロードの確認]、[進行状況]、[エラーが発生しました]の順に実行されます。再度アクセスした場合も同様です。

どちらの場合も、オフラインでURLに戻ると、「接続が見つかりません」というエラーメッセージが表示されます。どちらのブラウザも最新バージョンです。

マニフェストキャッシュを変更して、CACHE:、NETWORK:、およびFALLBACK:セクションを含めることも効果がありませんでした。絶対URLを使用しても何も変わりませんでした。

Packetyzerと呼ばれるパケットスニファプログラムで監視すると、マニフェストファイルが正しいMIMEタイプでブラウザ(この場合はFirefox)に配信されていることがわかります。誰かが私が間違っているかもしれないことについての考えを持っていますか?

ファイルは現在http://www.factordice.com/html5でホストされています

4

0 に答える 0