html5离线缓存 1. 简介 1.1 什么是离线缓存 1.2 优点 1.3 针对对象 2. 实现方式 3. window.applicationCache对象相关api
HTML5中引入了应用程序缓存，意味着Web应用可以进行数据缓存，并可以在没有因特网连接的情况下进行访问。带来较好的用户体验。
1. 离线浏览
2. 提升页面载入速度
3. 减轻服务器负载
1. html中的缓存机制浏览器自带缓存
2. 针对目标图片、JS文件、CSS缓存、静态页面
① 服务器端需要维护一个manifest清单(哪些内容缓存、哪些内容不缓存、缓存失败如何处理)(CACHE MANIFEST->CACHE:、NETWORK:、FALLBACK:)② 浏览器页面中需要简单设置（当前页面使用哪个缓存清单文件）
在服务器中配置缓存清单文件 CACHE MANIFEST
# 声明是缓存清单文件 version 1.0.0.2.9# 要缓存的js/css文件
CACHE:
js/jquery-3.4.1.js
js/main.js# 要使用网络才能访问的内容 不需要缓存
NETWORK:
shop.jsp# 缓存失败怎么处理
FALLBACK:
css/style.css / css/styleError.css
在服务器配置文件中配置映射清单文件类型 以tomcat为例：在WEB-INF/web.xml中<mime-mapping><extension>manifest</extension><mime-type>text/cache-manifest</mime-type></mime-mapping>
在html页面头部声明清单文件 <html manifest="index.manifest">
applicationCache.status 状态 style status UNCACHED=0 未缓存 IDLE=1 空闲 CHECKING=2 检查中 DOWNLOADING=3 下载中 UPDATEREADY=4 更新准备就绪 OBSOLETE=5 过期
项目 Value checking 当检查更新或第一次下载manifest清单时，往往是第一个被触发的事件（简单版理解，当检查缓存时，会触发） noupdate 检查到manifest清单文件不需要更新时触发（简单版理解，检查如果不需要更新缓存，那么后续事件全部不会执行） downloading 更新或第一次下载manifest清单时触发 progress 下载清单文件过程中周期性触发 loaded/total updateready 更新下载清单文件完成并就绪后触发 cached 清单文件下载完毕并成功缓存后触发 obsolete 当访问清单文件返回404或401时触发
error 在以下情况发生时触发a 已触发obsolete事件b 清单文件没有改变，但清单是文件下载失败c 获取清单文件时发生错误d 正在更新本地缓存时，清单文件再次被更改
appCache. onprogress = function ( e) { } ; appCache. addEventListener ( "checking" , function ( e) { } ) ; $ ( appCache) . on ( "checking" , function ( e) { } ) ;
applicationCache.update(); 请求更新缓存applicationCache.swapCache(); 更新本地缓存数据
)
