ms

188 阅读1分钟

html

1.html5离线存储
在用户没有与因特网连接时,可以正常访问站点或应用,在用户与因特网连接时,更新用户机器上的缓存文件。
原理: HTML5的离线存储是基于一个新建的.appcache文件的缓存机制(不是存储技术),通过这个文件
上的解析清单离线存储资源,这些资源就会像cookie一样被存储了下来。
之后当网络在处于离线状态下时,浏览器会通过被离线存储的数据进行页面展示。如何使用:

页面头部像下面一样加入一个manifest的属性;在cache.manifest文件的编写离线存储的资源;
CACHE MANIFEST
#v0.11
CACHE:
js/app.js
css/style.css
NETWORK:
resourse/logo.png
FALLBACK:
/ /offline.html

在离线状态时,操作window.applicationCache进行需求实现。
2.浏览器是怎么对HTML5的离线储存资源进行管理和加载的呢?
在线的情况下,浏览器发现html头部有manifest属性,它会请求manifest文件,如果是第一次访问
app,那么浏览器就会根据manifest文件的内容下载相应的资源并且进行离线存储。如果已经访问过app
并且资源已经离线存储了,那么浏览器就会使用离线的资源加载页面,然后浏览器会对比新的manifest文
件与旧的manifest文件,如果文件没有发生改变,就不做任何操作,如果文件改变了,那么就会重新下载
文件中的资源并进行离线存储。离线的情况下,浏览器就直接使用离线存储的资源。