html5存储笔记(慕课网)

1、本地存储(localstorage && sessionstorage)

2、离线缓存(application cache)

3、IndexedD 和 Web Sql

由于我是初学者,离线缓存和IndexedD 和 Web Sql我看了视频也不是很清楚,对这两张种比较感兴趣的可以上慕课网---html5存储课程看。

链接:点击打开链接


本地存储:

API

--localstorage与sessionstorage

存储形式

--key--》value

过期

1)localstorage:永久存储,永不失效,除非手动删除

2)sessionstorage:会话结束就失效

大小

--官方给出的文档是,每个域名5M

浏览器支持情况:(这是比较老的)

使用方法
--getItem

--setItem

--removeItem

--key

--clear

使用注意事项:

1)使用前要判断浏览器是否支持

2)写数据时候,需要异常处理,避免超出容量抛错

3)避免吧敏感的信息存入localstorage

4)key的唯一性

使用限制:

1)存储更新策略,过期控制

我们可以通过业务逻辑代码进行控制,代码示例如下:

function set(key, v) {
            var curTime = new Date().getTime();
            localStorage.setItem(key, JSON.stringify({ data: v, time: curTime }));
        }
        //exp为过期天数
        function get(key, exp) {
            var data = localStorage.getItem(key);
            var dataObj = JSON.parse(data);
            if (new Date().getTime() - dataObj.time > exp) {
                console.log('expires');
            } else {
                console.log("data=" + dataObj.data);
            }
        }

2)子域名之间不能共享存储数据

3)超出存储大小之后如何存储(LRU,FIFO)

      这个我还去实现,有实现的大神,求示例。。。

4)server端如何取到

      与cookie不一样,localStorage没有与http请求头一起传递到服务端,所以我们想要获取localStorage只能是url带参数传递过去。

使用场景

1)利用本地数据,减少网络传输

2)弱网络环境下,高延迟,低带宽,尽量把数据本地化


今天就这样子啦。。有错误和改进的地方,请告诉我,谢谢。




评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值