H5存储
2017-06-29 本文已影响0人
Love小六六
- 服务器端存储
- cache:缓存
- 磁盘文件
- 数据库
- 内存
- cookies
在http请求头上带着，大小4k，会存在安全性问题 - H5存储
（1）本地存储(localstorage和sessionstorage)
配合JSON.stringify()使用
存储形式key->value，5M,子域名间不能共享存储数据
- localstorage(永久存储，永不失效，除非手动删除)
- sessionstorage(新打开一个页面或者关闭浏览器，sessionstorage消失)
常用API
getItem
setItem
removeItem
key
clear
使用场景
利用本地数据，减少网络传输
弱网环境下，高延迟，低带宽，尽量把数据本地化
（2）indexDB(webSQL)
一种能在浏览器中持久的存储结构化数据的数据库，并且为web应用提供了丰富的查询能力
按照域名分配独立空间
（3）html5离线缓存（offline application）
让web应用在离线的情况下继续使用，通过mainifest文件指明需要缓存的资源
检测是否在线 navigator.online
//创建mainifest文件
CHCHE MANIFEST
#version n.n
CACHE:
#需要缓存的文件
NETWORK:
#每次重新拉取的文件
FALLBACK:
#离线状况下代替文件
在html页面中引用mainifest文件
<html mainifest="sample.appcache">
在服务器中添加mime-type text/cache-mainifest
如何更新
如果有修改资源文件，必须通过修改mainifest文件来刷新被缓存的文件列表
优势：
- 完全离线
- 资源被缓存，加载更快
- 降低sever负载
缺陷： - 含有mainfest属性的当前请求页无论如何都会被缓存
- 更新需要建立在mainifest文件的更新，文件更新后需要页面再次刷新（需要两次刷新才能获取资源）
- 更新是全局性的，无法单独更新某个文件
- 对于链接的参数变化是敏感的，任何一个参数的修改都会被重新缓存
