0
点赞
收藏
分享

微信扫一扫

离线存储 application cache


 

    离线与缓存

 

  • 网页缓存依赖网络的存在,而离线应用在离线状态下仍然可用
  • 网页缓存主要缓存当前网页相关内容,也仅限当前页面的读取;离线应用主要缓存文件,只要设置缓存的文件,都能在离线状态下读取该文件

    设备支持情况

 


 

   

    使用js来判断

 


if(window.applicationCache){    //支持的进来

}


 

    manifest文件:

 

//如果关联上manifest文件
<html manifest="cache.manifest">


    识别manifest文件:

 

  • 由于manifest文件的MIME类型是text/cache-manifest
  • web服务器需要配置MIME类型:

//web.xml<mime-mapping>

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

</mime-mapping>


    manifest的写法:


  • 第一行必须是CACHE MANIFEST,不能有空行或空格   
  • #开头为注释
  • CACHE:为要缓存的文件,后面每行一个文件,不支持通配符,必须是具体的文件名,不能包含hash/query

     -------当网络不可用或不在线时候,此部分文件会通过本地缓存直接读取

 

  • NETWORK:为网络白名单,可以为*/文件夹/域名/具体地址

      -------定义在NETWORK行下面的文件清单被指定为无论文件是否被缓存,必须从网络中下载

 

 

  • FALLBACK:可选,资源获取失败时候的候补方案,每行分别指定在线和离线时候使用的文件

       -------该清单的前半部分表示当无法获取到该文件的时候,则请求转发到后半部分的文件,比如下面如果访问不到offline.html页面,就返回index.html

 

    实例:

 

 

CACHE MANIFEST#version:1.0.0

CACHE:
http://***.com/css/reset.css
http://***.com/a.gif

NETWORK:
images/

FALLBACK:
offline.html     index.html

 

 

举报

相关推荐

0 条评论