HTMLアプリケーションキャッシュオフラインアプリケーション

HTMLアプリケーションキャッシュ（HACをいう。）このソケットでアプリケーションキャッシュのリソースのためのインタフェースのセットでは、Webページへのオフラインアクセスを可能にする、または低速の場合に素早くページを開くことができます。
HACを使用した後、リソースがロードされますヒットヒット場合、ブラウザはまず、要求時にサイトへのキャッシュになりますし、そうでない場合、サーバに要求し、その後、ロードされました。

伝統的なブラウザのキャッシュを持つHAC（種類304）が異なる場合、HACは、キャッシュされたリソースとして、コレクション全体のキャッシュキーのURL入力ページではなく、単一のファイルのキャッシュです。
リソースがキャッシュマニフェスト（マニフェスト）を介してブラウザに通知するために必要とされるHACのウェブサイトは、HACのページブラウザのリストに追加されますリソースに宣言しました。
次のようにマニフェストに宣言方法：

エントランスのindex.htmlページ

<!doctype html>
<html manifest="/app.manifest">
    <header>
    <script src="/app.js"></script>
    </header>
</html>

/app.manifestファイル

CACHE MANIFEST
/index.html
/app.js

index.htmlをとHACへのリソースのセットとして追加app.jsにブラウザの後。

第二のブラウザでページを開き、彼らは、HACでキャッシュを見つけて、ロードされます。
しかし、ブラウザは要求が成功した場合、それはあなたがファイルの内容の変更を見つけた場合、新しいバージョンがマニフェスト再要求に記載されているファイルに従うだろう、比較にマニフェストの新旧両方のバージョンがかかります、/app.manifestファイルを要求しようとしますHACの年にわたるリソース、およびアップデート。ファイルアクセスエラーがある場合はその後、それはHAC停止更新をリードします。しかし、デフォルトのクロムは、アプリケーションがクロムである場合、5メガバイトのキャッシュサイズを制限し、より多くのスペースをバッファリングしたい、宣言unlimitedStorageに、その後必要になります。
ブラウザでは、また、手動でチェックをトリガするapplicationCache.update（）を実行することができます。その後applicationCache.statusは、HACを更新するかどうかを判断します。
以下のapplicationCache.status状況：

appCache.UNCACHED = 0; // 网页未缓存
appCache.IDLE = 1; // 闲置
appCache.CHECKING = 2; // 检查中
appCache.DOWNLOADING = 3; // 下载中
appCache.UPDATEREADY = 4; // 更新已准备完毕
appCache.OBSOLETE = 5; // 更新失败

// js 内主动更新的流程
var appCache = window.applicationCache;
 
window.applicationCache.addEventListener('updateready', function(e) {
    if (window.applicationCache.status == window.applicationCache.UPDATEREADY) {
        window.applicationCache.swapCache();
        if (confirm('A new version of this site is available. Load it?')) {
                window.location.reload();
        }
    }
});
  
appCache.update(); // Attempt to update the user's cache.

この記事はで再現されています。HTMLオフラインアプリケーションキャッシュを使用します

おすすめ