HMTL 5のローカルキャッシュ
4378 ワード
HTML 5ページアプリケーションでは、アプリケーションCacheオブジェクトがローカルキャッシュを表します.オフラインアプリケーションの開発中にアプリケーションCacheオブジェクトのonUpdateReadyイベントを呼び出すことで、ローカルキャッシュ解放完了更新をモニタできます.ローカルのキャッシュを手動で更新する方法は、次の2つあります.
(1)onUpdateReadyイベントでswapCache()メソッドを呼び出す.
(2)アプリケーションCacheオブジェクトのupdate()メソッドを直接呼び出す.
ローカルでキャッシュを更新すると、アプリケーション・キャッシュ・オブジェクトの他のイベントを呼び出して、ローカル・キャッシュの更新ステータスをリアルタイムで監視できます.
ローカルキャッシュが更新されたかどうかを監視します.コードは次のとおりです.
updatereadyイベントがトリガーされると、ローカルキャッシュが更新されたことを示します.アプリケーション・Cacheオブジェクトのupdateメソッドを呼び出すことで、ローカル・キャッシュを手動で更新できます.呼び出しフォーマットは次のとおりです.
更新可能なローカルキャッシュがある場合、このメソッドを呼び出すと、ローカルキャッシュを更新できます.では、更新可能なローカルキャッシュがあるかどうかを監視し、updatereadyイベントで監視するほか、アプリケーション・Cacheオブジェクトの「status」プロパティを呼び出すこともできます.このプロパティには複数の値があり、値が「4」の場合、更新可能なローカルキャッシュがあることを示します.
メソッドswapCache()の機能は、ローカルキャッシュを更新することであり、メソッドupdate()とは次の2点が異なる.ローカルキャッシュを更新するイベントは異なります.メソッドswapCache()はメソッドupdate()よりも早くローカルキャッシュを更新します. トリガイベントは異なります.メソッドswapCache()は、呼び出しを更新するにはupdatereadyイベントでなければなりません.メソッドupdate()はいつでも呼び出すことができます.
ローカルキャッシュの更新時にトリガーされる他のイベント
checking:更新の有無を検出中
downloading:使用可能なキャッシュをダウンロードしています
noupdate:最小キャッシュ更新なし
progress:ローカルキャッシュが更新中
Cached:更新に成功したローカルキャッシュ
error:ローカルキャッシュ更新中にエラー
(1)onUpdateReadyイベントでswapCache()メソッドを呼び出す.
(2)アプリケーションCacheオブジェクトのupdate()メソッドを直接呼び出す.
ローカルでキャッシュを更新すると、アプリケーション・キャッシュ・オブジェクトの他のイベントを呼び出して、ローカル・キャッシュの更新ステータスをリアルタイムで監視できます.
ローカルキャッシュが更新されたかどうかを監視します.コードは次のとおりです.
<!doctype html>
<html manifest="test.manifest">
<head>
<meta charset="utf-8">
<title> </title>
<script type="text/javascript">
function $$(id){
return document.getElementById(id);
}
function init(){
window.applicationCache.addEventListener("updateready",function(){
$$("pStatus").style.display = "block";
$$("pStatus").innerHTML = " updateready d。。"
},true);
}
</script>
</head>
<body onLoad="init();">
<fieldset>
<legend> updateready </legend>
<p id="pStatus"/>
</fieldset>
</body>
</html>
updatereadyイベントがトリガーされると、ローカルキャッシュが更新されたことを示します.アプリケーション・Cacheオブジェクトのupdateメソッドを呼び出すことで、ローカル・キャッシュを手動で更新できます.呼び出しフォーマットは次のとおりです.
window.applicationCache.update()更新可能なローカルキャッシュがある場合、このメソッドを呼び出すと、ローカルキャッシュを更新できます.では、更新可能なローカルキャッシュがあるかどうかを監視し、updatereadyイベントで監視するほか、アプリケーション・Cacheオブジェクトの「status」プロパティを呼び出すこともできます.このプロパティには複数の値があり、値が「4」の場合、更新可能なローカルキャッシュがあることを示します.
<!doctype html>
<html manifest="test.manifest">
<head>
<meta charset="utf-8">
<title> update() </title>
<script type="text/javascript">
function $$(id){
return document.getElementById(id);
}
function init(){
if(window.applicationCache.status == 4){
$$("pStatus").style.display = "block";
$$("pStatus").innerHTML = " 。。";
}
}
function btnUdp_click(){
window.applicationCache.update();
$$("pStatus").style.display = "block";
$$("pStatus").innerHTML = " ";
}
</script>
</head>
<body onLoad="init();">
<fieldset>
<legend> ， ！</legend>
<p id="pStatus"/>
<p id="pShow">
<input id="btnUpd" value=" " type="button" onClick="btnUdp_click()">
</p>
</fieldset>
</body>
</html>
メソッドswapCache()の機能は、ローカルキャッシュを更新することであり、メソッドupdate()とは次の2点が異なる.
<!doctype html>
<html manifest="test.manifest">
<head>
<meta charset="utf-8">
<title> swapCache </title>
<script type="text/javascript">
function $$(id){
return document.getElementById(id);
}
function init(){
window.applicationCache.addEventListener("updateready",function(){
$$("pStatus").style.display = "block";
$$("pStatus").innerHTML = " ";
window.applicationCache.swapCache();
$$("pStatus").innerHTML = " ";
},true);
}
</script>
</head>
<body onLoad="init();">
<fieldset>
<legend> </legend>
<p id="pStatus"/>
</fieldset>
</body>
</html>ローカルキャッシュの更新時にトリガーされる他のイベント
checking:更新の有無を検出中
downloading:使用可能なキャッシュをダウンロードしています
noupdate:最小キャッシュ更新なし
progress:ローカルキャッシュが更新中
Cached:更新に成功したローカルキャッシュ
error:ローカルキャッシュ更新中にエラー