html5游戏缓存,HTML5之缓存

----- 缓存文件

- 使用UTF-8编码

- 以Cache Manifest 开头

- 三个基本部分

CACHE MANIFEST

menu.html

menu.js

# login requires network

connection

NETWORK:

login.php

FALLBACK:

/ /menu.html

CACHE:

style/innbar.css

- NetWork：此类文件需要从网络访问

- FallBack：缓存找不到的时候显示它

- Cache：真正要缓存的内容

----- 离线状态

- window.applicationCache

取值 名称 含义

---------------------------------------------------------------------

0UnCached页面完全没有被缓存,可能是没被设定或者尚未被下载

1IDLE已经被下载并可以访问

2CheCking正在检查缓存是否需要更新

3Downloading发现新版本正在更新

4UpDateReady已经下载完成,下次离线访问就可用

5ObSolete缓存清单文件访问失败,此页面会被从缓存中清除

window.applicationCache.status// 获取状态

----- 离线事件

window.applicationCache.add EventListener("progress",function(e) {

alert("新文件下载");

},false);

名称 描述

--------------------------------------------------

checking检查在manifest里面的文件是否有更新

noupdate没有找到新文件

donwloading下载中

progress任何文件被下载这一事件都会被唤起

cached所有缓存都被下载完

updateready由于manifest,所有文件被重新下载完毕

obsolete由于manifest清空,文件找不到

error各种错误,比如manifest文件格式错

------ 更新缓存方法

- JS中提供update()和swapCache()直接更新缓存

更新缓存

window.applicationCache.addEventListene r("updateready",function(e) {window.applicationCache.swapCache();

alert("New Cache in action");

},false);

- 可以使用SetInterval()定期唤醒更新

------ 检测是否在线

- window.navigator.onLine

window.addEventLis tener("online", function() {

alert("你是在线的");

},false);

window.addEventLis tener("offline", function()

{

alert("你是离线的");

},false);

- 不测路由,只测连接,所以可能联网当不能上网