离线缓存这个功能的实现有以下步骤:

1,以nginx做web服务器为例,在mime.types文件中添加一行:text/cache-manifest     manifest,作用是为了让服务器识别该类型文件

2,在html文件html标签中添加一行manifest="cache.appcache",告诉浏览器要加载的内容。

3.在该目录下新建一个文件cache.appcache,文件内容为:

chche manifest 为版本号:

chche 是告诉浏览器要缓存的文件:

network 是指定不会缓存的文件,这里的*号表示所有其他文件都需要因特网连接

fallback:是如果无法建立因特网连接时加载的页面

完成后便可以执行一下,会发现浏览器已经加载了相应的文件在本地上,断开网络,这些文件依然可以访问。

H5 应用程序缓存(离线缓存)的更多相关文章

  1. 使用 jQuery Mobile 与 HTML5 开发 Web App —— HTML5 离线缓存

    本文要介绍的,是 HTML5 离线网络应用程序的特性,离线网络应用程序在 W3C 中的实际名称是 "Offline Web applications" ,也称离线缓存.当用户打开浏 ...

  2. 离线缓存 manifest

    程序的离线缓存由一个叫做manifest的文本文件控制,把需要离线缓存的文件列在里面即可,这个列表还可以控制需要缓存的情况,甚至当用户从缓存地址进入到没有缓存的地址应该显示什么 当浏览器下载解析了ma ...

  3. H5离线缓存技术Application Cache

    H5离线缓存技术Application Cache 1.离线缓存技术:是浏览器本身的一种机制 HTML5引入Application Cache(应用程序缓存)技术,离线存储可以将站点的一些文件存储在本 ...

  4. H5应用程序缓存 - Cache manifest

    一.作用 离线浏览 - 根据文件规则把资源缓存在本地,脱机依然能够访问资源,联网会直接使用缓存在本地的文件.优化加载速度,节约服务器资源. 二.适用场景 正如 manifest 英译的名字:离线应用程 ...

  5. 源码推荐:移动端商城(微信小程序源代码) WebView离线缓存

    移动端商城(微信小程序源代码)(上传者:腾讯攻城师jack) 功能包括:商品橱窗,商品搜索,购物车,结账等功能. TableView嵌套webView自适应高度(上传者:linlinchen) tab ...

  6. Atitit.h5 web webview性能提升解决方案-----fileStrore缓存离线存储+http方案

    Atitit.h5 web webview性能提升解决方案-----fileStrore缓存离线存储+http方案 1. 业务场景 android+webview h5 css背景图性能提升1 2. ...

  7. h5 离线缓存小demo

    传统的web应用是在线应用,这其实也是web的特色,对于PC时代问题并不大,但到了移动互联网时代,设备终端位置不再固定,依赖无线信号,网络的可靠性变得更低.比如:在火车上,穿山越岭进隧道,便无法访问w ...

  8. H5 离线缓存的用法

    H5离线缓存基础系列   1.什么是离线缓存 离线缓存:离线缓存可以将站点的一些文件缓存到本地,它是浏览器自己的一种机制,将需要的文件缓存下来,以便后期即使没有连接网络,被缓存的页面也可以展示. 2. ...

  9. HTML5 的 applicationCache 应用程序缓存离线存储功能与 manifest 文件

    一. 实现 HTML5 applicationCache 的步骤 一般的操作步骤 1. 新建 manifest 文件 如文件名为  lzwme.manifest,内容配置参考如下: 01 CACHE ...

随机推荐

  1. Python图像处理库:PIL中Image,ImageDraw等基本模块介绍

    Python图像处理库:PIL中Image,ImageDraw等基本模块介绍 标签: 图像处理PILPYTHON 2016-08-19 10:58 461人阅读 评论(0) 收藏 举报  分类: 其他 ...

  2. UVa 10954 Add All(优先队列)

    题意  求把全部数加起来的最小代价  a+b的代价为(a+b) 越先运算的数  要被加的次数越多  所以每次相加的两个数都应该是剩下序列中最小的数  然后结果要放到序列中  也就是优先队列了 #inc ...

  3. Spring自我总结

    1.InitializingBean Spring设置完一个bean的合作者后,会检查bean是否实现InitializingBean接口,实现的话会调用afterPropertiesSet(Init ...

  4. Coursera Algorithms week4 基础标签表 练习测验:Inorder traversal with constant extra space

    题目原文: Design an algorithm to perform an inorder traversal of a binary search tree using only a const ...

  5. Linux特殊符号及基础正则表达式

    第1章 特殊符号 1.1 引号系列 1.1.1 单引号 所见即所得  单引号里面的内容会原封不动的输出 [root@oldboyedu50-lnb ~]# echo 'oldboy $LANG $PS ...

  6. activiti安装-------安装插件

    对上面的放大

  7. [Swift通天遁地]六、智能布局-(5)给视图添加Align(对齐)和Fill(填充的约束以及Label的约束

    ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★➤微信公众号:山青咏芝(shanqingyongzhi)➤博客园地址:山青咏芝(https://www.cnblogs. ...

  8. Codeforces 766E

    题意:给一棵树(1e5),每个节点上有对应权值(0<=ai<=1e6)定义树上两个节点间的距离为路径中节点的异或,求所有节点对间的距离和(包括节点自身也作为节点对,距离为节点权值). 解题 ...

  9. 基于TensorFlow的车牌号识别系统

    简介 过去几周我一直在涉足深度学习领域,尤其是卷积神经网络模型.最近,谷歌围绕街景多位数字识别技术发布了一篇不错的paper.该文章描述了一个用于提取街景门牌号的单个端到端神经网络系统.然后,作者阐述 ...

  10. 【转载】HTTP 请求头与请求体

    原文地址: https://segmentfault.com/a/1190000006689767 HTTP Request HTTP 的请求报文分为三个部分 请求行.请求头和请求体,格式如图:一个典 ...