HTML5之客户端存储(Storage)
- 关于客户端存储技术
- storage
一、关于客户端(浏览器)存储技术
浏览器的存储技术第一个能想到的应该就是cookie,关于cookie本身出现的初衷是为了解决客户端识别,可存储信息量小(4k左右),并且每次网络请求都会被请求协议携带发送到服务器,这在一定程度上是比较浪费网络资源,损耗性能。
在HTML5中提供了一个新的客户端存储技术Storage:
cookie与storage的异同:
相同点:同样受同源策略影响,只有在域名一致的情况下才能查看到对应的数据。
不同点:
1.cookie的数据存储量在4K左右,storage的存储量大约在5MB左右;
2.navigator.cookieEnabled检测是否启用了cookie,也就说cookie可以认为控制是否启用。storage则是自动启用,不会被人为关闭。
3.coocie中不建议使用分号、逗号、空格等特殊字符;如果需要使用可以使用转码操作:
encodeURIComponent()//传入特殊字符转码,可以应用转码作为简单的加密处理
decodeURIComponent()//将转码的字符转换为正常字符
storage中只能接收字符串类型的数据,具体操作见下一节。
4.cookie有时效性可以设置有效时间,如果不设置的话在浏览器窗口关闭时就会失效;storage是永久存储。
5.cookie会与服务器通信;storage只存在客服端,不参与服务器通信。
关于cookie的网络应用可以参考这篇博客:计算机网络(HTTP)之客户识别:cookie机制
二、Storage的应用
- localStorage:永久存储,除非手动删除
- sessionStorage:临时存储,窗口关闭就会被清除
写入与读取localStorage数据:
// 写入数据
localStorage.name = "duyi";
localStorage.obj = JSON.stringify({
name:'dengge'
})
// 读取数据
var name =localStorage.name;
var obj = JSON.parse(localStorage.obj);
写入后可以在控制台的Application中查看得到数据:
localStorage与sessionStorage的写入与读取等操作方式一致,Storage的API及属性(同时适应localStorage和sessionStorage):
Storage.length:数据量(返回一个整数,标识存储在Storage对象中的数据项数量);
Storage.key(index):获取键名(该方法接收一个数值,返回对应数据的键名);
Storage.getItem(item):获取与键对应的值(该方法接收一个键名作为参数,返回键名对应的值);
Storage.setItem(item,val):添加Storage数据(该方法接受两个参数,第一个参数为数据名称,第二个为数据值);
Storage.removeItem(item):删除指定的数据(该方法接收一个键名,并把该键名对应的数据从存储中删除);
Storage.clear():清除该域下的所有Storage缓存的数据。
最新文章
- DIP原则、IoC以及DI
- JSCH通过密钥文件进行远程访问
- j2ee部分
- js php json
- PHP中spl_autoload_register()函数
- Django migrations 重命名
- 简述oracle视图
- [转载]《C++0x漫谈》系列之:多线程内存模型
- ulimit调优
- UVa 11825 (状压DP) Hackers' Crackdown
- iOS内存管理系列之一:对象所有权与引用计数
- QTableView中嵌入复选框CheckBox 的四种方法总结
- beanutils通过SimpleProperty使用get或set方法赋值
- linux手工笔记
- 细说java系列之注解
- 格式化json
- 关于c#的知识博客
- postgresql-查看表大小
- Expo大作战(十五)--expo中splash启动页的详细机制
- POJ 1270
热门文章
- 解决MySQL5.7输入show databases 不显示内容的问题
- C++ STL——异常
- java 注解方式 写入数据到Excel文件中
- 删除指定路径下固定格式,以.log结尾、三天前的文件,或删除空的日志文件
- Git安装以及配置SSH Key——Windows
- C#枚举扩展方法,获取枚举值的描述值以及获取一个枚举类下面所有的元素
- SpringCloud学习(四)断路器(Hystrix)(Finchley版本)
- prometheus 监控 hadoop + Hbase + zookeeper
- 2019牛客暑期多校训练营(第四场)- J free
- Min swaps to sort array