4

Dive into HTML5 ：キャッシュマニフェスト：フォールバックセクション

CACHE MANIFEST
FALLBACK:
/ /offline.html
NETWORK:
*

このコードブロックが正確に何をするのかを考えると、URLからはわかりません。フォールバックセクションは、何かが見つからない場合、offline.htmlページを表示することを意味しますか

その後、network: *すべてのリソースがキャッシュされますか？それはまた言います

各ページで共通のCSS、JavaScript、および画像を使用します。これらの各リソースは、明示的にリストする必要があります。CACHE

network: *これは、すべてをキャッシュすると言っているように見えるところと矛盾しているようですか？

4

2 に答える 2

14

キャッシュマニフェストには、CACHE、NETWORK、FALLBACKの3種類の見出しがあります。見出しの下にないものはすべて、暗黙的にCACHEの下に設定されます。各セクションの説明：

キャッシュ：この見出しの下のファイルはキャッシュされます。

ネットワーク：この見出しの下のファイルはインターネット接続を必要とするため、キャッシュされません。

フォールバック：この見出しの下のパターンと一致し（すべてのファイルに一致するパターン「/」など）、キャッシュされていないファイルには、代わりにフォールバックファイルが表示されます。

Dive into HTML 5のコードブロックに関しては、そのすぐ下に「NETWORK：*」の部分の説明があります。

つまり、この架空のオフライン対応のWikipediaをオンラインで閲覧している間、ブラウザは、別のドメインにある場合でも、画像や動画、その他の埋め込みリソースを通常どおりに取得します。（これは、オフラインWebアプリケーションの一部でなくても、大規模なWebサイトで一般的です。HTMLページはローカルで生成および提供されますが、画像とビデオは別のドメインのCDNから提供されます。）このワイルドカードフラグがない場合、オフライン対応のWikipediaは、オンラインのときに奇妙な動作をします。具体的には、外部でホストされている画像や動画は読み込まれません。

次の引用：

各ページで共通のCSS、JavaScript、および画像を使用します。これらの各リソースは、CACHEに明示的にリストする必要があります

つまり、必要なすべてのCSS、Javascript、および画像ファイルをCACHE見出しの下のマニフェストに含める必要があります。NETWORKの見出しは「すべてをキャッシュする」という意味ではないため、「NETWORK：*」と競合しません。これは実際には反対の意味です。つまり、NETWORKの見出しの下にあるものはすべてインターネット接続が必要であり、キャッシュしないでください。

于 2011-01-13T08:46:12.830 に答える
7

FALLBACKについてもっと便利なものを見つけました：

少し実験した後、FALLBACK：のファイルをCACHEセクションとNETWORKセクションのどちらに表示するかなど、さまざまなことを試しました。答えはノーのようです。

例として...フォールバック：sign-up-portrait.pngoffline-portrait-1.png sign-up-landscape.pngoffline-landscape-1.png

最近、私のマイクロサイトの1つでこれを指定しました。目的は、オンラインの場合はsign-up- pngファイルを表示し、オフラインの場合はoffline-pngファイルを表示することです。これはうまく機能します。特に、各行の左側にあるファイルは、ネットワークセクションにあるかのように暗黙的に示され、サイトは常にそれらをオンラインにしようとします。これらをネットワークセクションにも追加しないでください。追加しないと、FALLBACKの内容が上書きされるように見えます。さらに、幸いなことに、右側のファイルは、CACHE：セクションに追加されたかのように暗黙的に指定されるため、最初に使用されなくても、最初のロード時にCACHEに明示的に追加しなくてもキャッシュされます。ただし、そこに追加することはできます。必要に応じて。違いはありません。

この構成では、Webサーバーのログを見ると、ページが更新されるたびに、apacheがマニフェストファイルとそのバージョンのページに必要なsign-up-pngファイル（CSSメディアがあります）に対して304をログに記録していることがわかります。ページサイズに基づいてどちらを決定するセレクター）。そのため、sign-up-pngファイルと通常のマニフェストチェックを常に正しくチェックしています。これはまさに私が望んでいることです。

徹底するために、ルートファイルがCACHE：セクションにもある必要があるかどうかを確認しようとしました。そうではないことがわかりました！トップレベルファイルがindex.htmlであり、そのhtmlタグでマニフェストファイルが指定されている場合、マニフェストファイルにindex.htmlを含める必要はなく、暗黙的にキャッシュされます。

アプリのキャッシュをどこまで拡張できるのか興味があります。iframeにリンクされているまたはiframe内にある他のhtmlファイルを含めることはできますか？それとも、それらすべてが別個の独自のマニフェストファイルを持っている必要がありますか？コメントしたい人はいますか？

フォーマットについてのサイドコメント、私がした間違いを犯さないでください、それは入れることです... NETWORK file1.js

コロンがないと、NETWORKはそれ自体がリソースであると考えて、完全に壊れてしまいます。

それは...ネットワーク：file1.jsでなければなりません

于 2012-11-03T16:28:50.050 に答える