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

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. Javascript中双等号(==)隐性转换机制 JS里charCodeAt()和fromCharCode()方法拓展应用:加密与解密

    Javascript中双等号(==)隐性转换机制   在Javascript中判断相等关系有双等号(==)和三等号(===)两种.其中双等号(==)是值相等,而三等号(===)是严格相等(值及类型是否 ...

  2. pymysql 本地不抱错 连接云数据库报错

    import pymysql h, pt, u, p, db = 'rm-2zeoye0j3957bw1w2.mysql.rds.aliyuncs.com', 3306, 'tongji_2017', ...

  3. c++中读写文件操作

    读写文件这个,不常用,每次用的时候都会百度一下,每次写法还都不一样,所有总是记混.今天利用点时间总结下之前工程中用过的.以后就安照这种方法写了. 搞acmicpc的时候喜欢用freopen(),这个是 ...

  4. new (C# Reference)

    https://msdn.microsoft.com/en-us/library/51y09td4.aspx In C#, the new keyword can be used as an oper ...

  5. 【HDU 4864】 Task

    [题目链接] http://acm.hdu.edu.cn/showproblem.php?pid=4864 [算法] 贪心 不妨将两个数组分别按x从大到小排序 然后枚举每件物品,选择x值大于该物品的且 ...

  6. hdu 1512 Monkey King —— 左偏树

    题目:http://acm.hdu.edu.cn/showproblem.php?pid=1512 很简单的左偏树: 但突然对 rt 的关系感到混乱,改了半天才弄对: 注意是多组数据! #includ ...

  7. POJ2985 The k-th Largest Group treap

    POJ2985 比较简单的平衡树题目 树内不要添加容量为1的节点 否则会超时. #include<iostream> #include<cstdio> #include< ...

  8. element-ui table 页面加载时,动态渲染后台传过来的数据(springmvc)

    jsp页面 <%@ page contentType="text/html;charset=UTF-8" language="java" %> &l ...

  9. SQL service 自动解决依赖包 验证

    依赖关系解决 ============================================================================================= ...

  10. aixcoder智能编程助手开发插件推荐

    1. aixcoder安装使用 1.1. 介绍 1.1.1. 功能 智能代码提示她用强大的深度学习引擎,能给出更加精确的代码提示: 代码风格检查她有代码风格智能检查能力,帮助开发者改善代码质量: 编程 ...