h5缓存

h5提供存储的api

浏览器端的存储

服务器端的存储有 cache，磁盘文件（图片），数据库，内存（存储缓存）

1. cookie及其缺点

cookie是http请求的头部必须带着，请求头带有存储信息，子域名的访问会造成主域名的污染，页面浏览速度慢，导致安全隐患

客户端存储的大小（4k）限制，可以将身份验证和购物车存储放在cookie中

2.本地存储localstorage&&sessionstorage

介绍localstorage存储，开发者工具resource中看出，（数组，json，脚本，样式文件）只能转为字符串才可以localstorage存储

图片如何存储呢

获取图片的地址，加载完图片之后创建和图片大小一样大小的canvas

使用drawimage（）将图片渲染到canvas中

使用todataurl（）取出该地址（字符串形式）放入localstorage中

之后再本地存储中使用localstorage.getItem(key)取出该图片地址，

使用dom方法渲染到页面，图片也可以跨域

使用localstorage需要注意：移动端浏览器等是否支持

 写数据时先setItem之后做已成处理 来判断

避免敏感信息localstorge

 key的唯一性，会覆盖的

子域名不可以共享存储数据，cookie可以实现跨域

超出存储大小使用LRU,FIFO

server端如何获取

3.离线缓存offline application cache

在web离线的情况下继续使用，再通过manifest文件指明要缓存的资源

缺点：1》manifest只能在第二次刷新时才能更新到app cache中被用户获取到

            2》manifest更新到app cache中会拉去所有缓存文件，会有损耗

创建manifest文件

引入manifest文件

检测是否在线  navigator.online

4.关系型数据indexDB（持久化存储数据化结构数据的数据库，为web提供丰富的查询能力)

关键字：事务，索引，游标