请描述 HTML5 离线存储的使用方法和工作原理。
考察说明
考查对 HTML5 离线存储(Application Cache)的基本使用和机制理解。
回答思路
- 【回答框架 1】离线存储主要通过 manifest 文件实现,在 HTML 标签的 manifest 属性中引用一个 .appcache 文件。该文件列出需要缓存的文件、不缓存的文件和回退文件。
- 【回答框架 2】工作原理是浏览器首次访问时下载并缓存清单中列出的资源,之后在离线状态下从缓存加载。manifest 文件变化时,浏览器会更新缓存。
- 【回答框架 3】使用时需注意 manifest 文件的 MIME 类型、缓存更新机制和浏览器缓存限制。
- 【关键点 1】使用 manifest 属性声明缓存清单
- 【关键点 2】缓存清单包含 CACHE、NETWORK、FALLBACK 三个部分
- 【关键点 3】浏览器在在线时也会优先使用缓存副本,更新需修改 manifest 文件
- 【易错点 1】不要把需要实时更新的资源放入缓存
- 【易错点 2】修改 manifest 文件才能触发缓存更新
- 【易错点 3】注意 manifest 文件自身的缓存问题