网站建设课设,个人网站素材图片,专业外包网站建设公司排名,烟台招远网站建设简介
离线存储指的是#xff1a;在用户没有与因特网连接时#xff0c;可以正常访问站点或应用#xff0c;在用户与因特网连接时#xff0c;更新用户机器上的缓存文件。
原理#xff1a;HTML5的离线存储是基于一个新建的 .appcache 文件的缓存机制(不是存储技术)#xf…简介
离线存储指的是在用户没有与因特网连接时可以正常访问站点或应用在用户与因特网连接时更新用户机器上的缓存文件。
原理HTML5的离线存储是基于一个新建的 .appcache 文件的缓存机制(不是存储技术)通过这个文件上的解析清单离线存储资源这些资源就会像cookie一样被存储了下来。之后当网络在处于离线状态下时浏览器会通过被离线存储的数据进行页面展示 使用方法 创建一个和 html 同名的 manifest 文件然后在页面头部加入 manifest 属性 html langen manifestindex.manifest在 cache.manifest 文件中编写需要离线存储的资源 CACHE MANIFEST#v0.11CACHE:js/app.jscss/style.cssNETWORK:resourse/logo.pngFALLBACK:/ /offline.htmlCACHE: 表示需要离线存储的资源列表由于包含 manifest 文件的页面将被自动离线存储所以不需要把页面自身也列出来。NETWORK: 表示在它下面列出来的资源只有在在线的情况下才能访问他们不会被离线存储所以在离线情况下无法使用这些资源。不过如果在 CACHE 和 NETWORK 中有一个相同的资源那么这个资源还是会被离线存储也就是说 CACHE 的优先级更高。FALLBACK: 表示如果访问第一个资源失败那么就使用第二个资源来替换他比如上面这个文件表示的就是如果访问根目录下任何一个资源失败了那么就去访问 offline.html 。 在离线状态时操作 window.applicationCache 进行离线缓存的操作 更新 manifest 文件通过 javascript 操作清除浏览器缓存 浏览器是如何对 HTML5 的离线储存资源进行管理和加载 在线的情况下浏览器发现 html 头部有 manifest 属性它会请求 manifest 文件如果是第一次访问页面 那么浏览器就会根据 manifest 文件的内容下载相应的资源并且进行离线存储。如果已经访问过页面并且资源已经进行离线存储了那么浏览器就会使用离线的资源加载页面然后浏览器会对比新的 manifest 文件与旧的 manifest 文件如果文件没有发生改变就不做任何操作如果文件改变了就会重新下载文件中的资源并进行离线存储。 离线的情况下浏览器会直接使用离线存储的资源。 注意事项
浏览器对缓存数据的容量限制可能不太一样某些浏览器设置的限制是每个站点 5MB。如果 manifest 文件或者内部列举的某一个文件不能正常下载整个更新过程都将失败浏览器继续全部使用老的缓存。引用 manifest 的 html 必须与 manifest 文件同源在同一个域下。FALLBACK 中的资源必须和 manifest 文件同源。当一个资源被缓存后该浏览器直接请求这个绝对路径也会访问缓存中的资源。站点中的其他页面即使没有设置 manifest 属性请求的资源如果在缓存中也从缓存中访问。当 manifest 文件发生改变时资源请求本身也会触发更新。