← 返回博客列表

HTML5 application cache笔记

Vic.Wang2016/09/30661 阅读0 喜欢最近更新 2026/07/08 14:54:57

本文写于 2016 年,距今已有 10 年,文中提及的技术方案与接口可能已经过时,请注意甄别参考。

application cache 缓存应用文件的一种方案, 它可以本整个网页需要的资源文件(包括 html)缓存在本地,当没有网络或者网络情况较差的时候,则使用本地的缓存文件来运行,使用方式也较为便利。

配置manifest文件:

CACHE MANIFEST//必须以这个开头
    version 1.0 //最好定义版本,更新的时候只需修改版本号
    CACHE:    //定义需要缓存的文件
        m.png
        test.js
        test.css
    NETWORK:  //此部分下列出的文件是需要连接到服务器的白名单资源。无论用户是否处于离线状态,对这些资源的所有请求都会绕过缓存。可使用通配符。
    *
    FALLBACK
    404.html, 500.html   //,用于指定无法访问资源时的后备网页。其中第一个 URI 代表资源,第二个代表后备网页。两个 URI 必须相关,并且必须与清单文件同源。可使用通配符。             

在html中设置缓存:

<html manifest="test.manifest">

</html>

在服务器上设置 manifest 的 MIME-TYPE:

<mime-mapping>
    <extension>manifest</extension>
    <mime-type>text/cache-manifest</mime-type>
</mime-mapping>


若有共鸣,不妨点个喜欢

本文地址:https://www.mingsixue.com/blog/detail/HTML5-application-cache

分享:微博QQ空间X