这篇文章给大家介绍怎么在HTML5中实现应用程序缓存，内容非常详细，感兴趣的小伙伴们可以参考借鉴，希望对大家能有所帮助。一、作用离线浏览 - 根据文件规则把资源缓存在本地，脱机依然能够访问资源，联网会直接使用缓存在本地的文件。优化加载速度，
这篇文章给大家介绍怎么在HTML5中实现应用程序缓存，内容非常详细，感兴趣的小伙伴们可以参考借鉴，希望对大家能有所帮助。
一、作用
离线浏览 - 根据文件规则把资源缓存在本地，脱机依然能够访问资源，联网会直接使用缓存在本地的文件。优化加载速度，节约服务器资源。
二、适用场景
正如 manifest 英译的名字：离线应用程序缓存，这项功能是设计给会有离线场景的应用来使用，例如：需要离线使用的手机APP/H5，亦或是PC端的纯静态页面。
三、问题
服务器资源更新后显示滞后需要多刷新一次页面
首次在载入页面时，浏览器会判断是否引入了 manifest，若检测到引入，则下载并按文件规则缓存资源。
再次载入页面时，便会根据 manifest 中规定的缓存文件使用本地缓存而不是请求服务器资源。
当 manifest 文件更新时，页面加载已经进行，但是缓存更新尚未完成，便会先使用旧 manifest 所缓存的文件，同时浏览器会将新的 manifest 文件里的缓存文件下载下来，若想看到最新的静态资源需要刷新下页面重新加载一次。
全量加载
当 manifest 文件更新时，所有的资源都要全部被下载一次，并且其中一个出现异常会导致整个 manifest 运行异常。
W3C标准及浏览器支持
作为 H5 的新属性，初衷是用来构造离线应用的，缓存网站资源的话原本浏览器的缓存机制（304）已经很好了，没必要再使用 manifest 做缓存；实际上因为使用反响并不好，W3C正在废弃 manifest。
四、使用方法
首先在标签 <html> 中指定 manifest 配置文件。
<html manifest="manifest.appcache">配置文件 manifest.appcache。
CACHE MANIFEST# 井号备注，这边可以放版本更新时间，修改备注算更新 manifest 文件CACHE:# 首次下载 CACHE 后列出来的文件后缓存到本地。/favicon.ico/main.CSSNETWORK:# NETWORK 下的文件不可被缓存，必须要与服务器连接。login.PHPFALLBACK:# 一行放两个路径，第一个是访问资源，第二个是替补；当无法访问前一个资源时，用后一个资源代替之。/cat/ /404.html关于怎么在Html5中实现应用程序缓存就分享到这里了，希望以上内容可以对大家有一定的帮助，可以学到更多知识。如果觉得文章不错，可以把它分享出去让更多的人看到。
--结束END--
本文标题: 怎么在Html5中实现应用程序缓存
本文链接: https://www.lsjlt.com/news/256298.html(转载时请注明来源链接)
有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341
下载Word文档到电脑，方便收藏和打印～
2024-05-12
2024-05-12
2024-05-12
2024-05-12
2024-05-12
2024-05-12
2024-05-12
2024-05-12
2024-05-12
2024-05-12
回答
回答
回答
回答
回答
回答
回答
回答
回答
回答
官方手机版
微信公众号
商务合作
0