zoukankan      html  css  js  c++  java
  • html5的离线缓存

    一个离线网络应用程序就是一个URL的列表,html,css,js,图片,或者其他类型的资源。

    把这些资源,在本地缓存下来,当你尝试在没有网络连接时访问网络应用程序,你的浏览器将自动切换并使用本地代替。

    1、服务器端配置
    需要在apache配置文件加:AddType text/cache-manifest .manifest,并重启服务器。

    2、manifest文件,格式如下

    #这一句必须存在,而且必须放在头部
    CACHE MANIFEST
    #指明要缓存的内容
    CACHE
    #指定无需缓存的文件
    NETWORK
    #这个声明,允许你在资源不可用的情况下,将用户重定向到特定文件
    FALLBACK
    


    创建res.manifest如下:

    CACHE MANIFEST
    CACHE:
    test.html
    test.css
    test.js
    NETWORK:
    test.jpg
    FALLBACK:
    

    3、在html标签添加属性manifest

    <!DOCTYPE html>
    <html lang="en" manifest="res.manifest">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <link rel="stylesheet" href="./test.css">
        <script src="test.js"></script>
    </head>
    <body>
        <img src="test.jpg" alt="">
    </body>
    </html>
    

    重新联网后,html内容改变,但页面仍没有变化,因为默认优先使用缓存,修改manifest文件,刷新就可以。

    html5提供了两种检测是否在线的方式:
    navigator.onLine和online/offline事件。

    1、navigator.onLine属性表示当前是否在线。
    2、开发者还需要在网络状态发生变化时立刻得到通知,所以提供了online/offline事件。

    applicationCache属性,事件,方法API,慎用。

  • 相关阅读:
    453. Minimum Moves to Equal Array Elements
    CDH的安装
    Java注解
    BeanUtils--内省加强
    Java内省
    ant工具
    log4j的配置及使用
    武汉科技大学ACM:1010: 零起点学算法89——母牛的故事
    武汉科技大学ACM:1009: 华科版C语言程序设计教程(第二版)例题5.4
    武汉科技大学ACM:1007: 不高兴的津津
  • 原文地址:https://www.cnblogs.com/jkko123/p/6372231.html
Copyright © 2011-2022 走看看