浏览器html5 无缓存,html5的离线web应用的浏览器和服务器交互的过程要是没有缓存怎么处理...

html5的离线web应用的浏览器和服务器交互的过程要是没有缓存就需要每次交互都要实时接口调用，增加网络开销。

一、离线存储的作用

1、用户可离线访问应用，这对于无法随时保持联网状态的移动终端用户来说尤其重要

2、用户访问本地的缓存文件，通常意味着更快的访问速度

3、仅仅加载被修改过的资源，避免同一资源对服务器多次的请求，大大降低了对服务器的访问压力

二、实现离线存储

1、在html标签里通过manifest属性引用一个cache.manifest文件，该文件里声明了浏览器需缓存的所有资源文件，如下所示：

!DOCTYPE html

html lang='cn' manifest='cache.manifest'

head

meta http-equiv=Content-Type content=text/html; charset=UTF-8

title离线缓存示例页面/title

!-- CSS文件引用 --

/head

body

!-- 各种标签 --

/body

!-- 各种脚本文件 --

/html

2、关于cache.manifest的定义

CACHE MANIFEST

# 注释：需要缓存的文件，无论在线与否，均从缓存里读取

chched.js

cached.css

# 注释：不缓存的文件，无论缓存中存在与否，均从新获取

NETWORK:

uncached.js

uncached.css

# 注释：获取不到资源时的备选路径，如index.html访问失败，则返回404页面

FALLBACK:

index.html 404.html

取消

评论