浏览器存储localStorage、sessionStorage、cookie
localStorage和sessionStorage浏览器支持IE8+(测试IE8不行);
localStorage:用于长久保存整个网站的数据,保存的数据没有过期时间,直到手动去除
sessionStorage:用于临时保存同一窗口(或标签的数据),在关闭窗口或标签页之后将会删除这些数据
localStorage和sessionStorage可使用的API都是相同的:
1、保存数据:localStorage.setItem(key,value);
localStorage.setItem("clickcount","1");
localStorage.clickcount = Number(localStorage.clickcount)+1;//将字符串转换为数字
2、读取数据:localStorage.getItem(key);
alert(localStorage.getItem("clickcount"))
3、删除单个数据:localStorage.removeItem(key);
4、删除所有数据:localStorage.clear();
5、得到某个索引的key:localStorage.key(index);
键/值对通常以字符串存储,可以按需求转换格式
cookie
创建cookie:document.cookie = "userId = 12138";
在cookie 的名或值中不能使用分号(;)、逗号(,)、等号(=)以及空格。在cookie的名中做到这点很容易,但要保存的值是不确定的。如何来存储这些值呢?方 法是用 escape()函数进行编码,它能将一些特殊符号使用十六进制表示,例如空格将会编码为“20%”,从而可以存储于cookie值中,而且使用此 种方案还可以避免中文乱码的出现。例如:
document.cookie="str="+escape("I love ajax");
当使用escape()编码后,在取出值以后需要使用unescape()进行解码才能得到原来的cookie值
设置cookie的过期时间(以 UTC 或 GMT 时间):document.cookie = "userId = 12138; expires=Thu, 18 Dec 2013 12:00:00 GMT";
读取cookie:var x = document.cookie;
document.cookie 将以字符串的方式返回所有的 cookie,类型格式: cookie1=value; cookie2=value; cookie3=value;
修改cookie:document.cookie = "userId = 18; expires=Thu, 18 Dec 2013 12:00:00 GMT; path=/";
删除coolie,只需要设置expires为以前的时间即可:document.cookie = "userId = 12138; expires=Thu, 18 Dec 2013 12:00:00 GMT";
cookie是存于用户硬盘的一个文件,这个文件通常对应一个域名,当浏览器再次访问这个域名时,便使这个cookie可用,因此,cookie可用跨越一个域名下的多个网页,不能跨域名使用
cookie可以保存用户的登录状态、跟踪用户的行为(网页城市的切换)、定制页面(网页皮肤切换)、创建购物车
cookie的确定主要集中在安全性和隐私保护
1、cookie可能被用户禁用
2、cookie和浏览器相关,使用不同的浏览器访问同一个页面,不同浏览器保存的cookie不能互相访问
3、cookie可能被删除,因为cookie是存储在用户硬盘的一个文件,很有可能被用户删除
4、cookie都是以纯文本的形式记录于文件中,因此要保存用户的敏感信息时最好先加密
浏览器存储localStorage、sessionStorage、cookie的更多相关文章
- 本地存储 localStorage/sessionStorage/cookie
cookie是个基础的东西.是服务器发送到客户端,存储在客户端的一小段数据.可以存储一些配置信息,客户标识信息等.用户下次访问这个网站时,会把上次网站发来的cookie一同发送回去.cookie保存在 ...
- 移动端浏览器隐私模式/无痕模式使用本地存储localStorage/sessionStorage的问题
移动端浏览器隐私模式/无痕模式使用本地存储localStorage/sessionStorage的问题 开发H5 webapp时经常需要使用本地存储,如localStorage和sessionStor ...
- 本地存储localStorage sessionStorage 以及 session 和cookie的对比和使用
cookie和session都是用来跟踪浏览器用户身份的会话方式. 1.验证当前服务中继续请求数据时,哪些缓存数据会随着发往服务器? 只有cookie中设置的缓存数据会发送到服务器端 2. 强调几点: ...
- localStorage sessionStorage cookie indexedDB
目录: localStorage sessionStorage cookie indexedDB localStorage localStorage存储的数据能在跨浏览器会话保留 数据可以长期保留,关 ...
- 深入了解浏览器存储:对比Cookie、LocalStorage、sessionStorage与IndexedDB
摘要: 对比Cookie.LocalStorage.sessionStorage与IndexedDB 作者:浪里行舟 Fundebug经授权转载,版权归原作者所有. 前言 随着移动网络的发展与演化,我 ...
- 客户端 localStorage, sessionStorage, cookie 的区别
SessionStorage, LocalStorage, Cookie这三者都可以被用来在浏览器端存储数据,而且都是字符串类型的键值对! 区别在于前两者属于WebStorage,创建它们的目的便是存 ...
- localstorage sessionstorage cookie的区别
一.基本概念 Cookie cookie比较小,大小限制在4kb左右,是网景公司的前雇员 LouMontulli 在1993年3月的发明.它的主要用途有保存登录信息,比如你登录某个网站市场可以看到“记 ...
- 原生JavaScript常用本地浏览器存储方法二(cookie)
JavsScript Cookie概述 cookie是浏览器提供的一种机制,它将document对象的cookie属性提供给JavaScript.可以由JavaScript对其进行控制,而并不是Jav ...
- localstorage sessionstorage cookie 备忘
/* sessionStorage: 保存的数据用于浏览器的一次会话,当会话结束(通常是该窗口关闭),数据被清空: localStorage: 保存的数据长期存在,下一次访问该网站的时候,网页可以直接 ...
随机推荐
- C++中的纯虚函数和虚函数的作用
1. 虚函数和纯虚函数可以定义在同一个类(class)中,含有纯虚函数的类被称为抽象类(abstract class),而只含有虚函数的类(class)不能被称为抽象类(abstract class) ...
- 算法Sedgewick第四版-第1章基础-003一封装日期
1. package ADT; import algorithms.util.StdOut; /**************************************************** ...
- 前端基础 之 jQuery
浏览目录 jQuery介绍 jQuery的优势 jQuery对象 jQuery内容 一.jQuery介绍 1.jQuery是一个轻量级的.兼容多浏览器的JavaScript库. 2.jQuery使用户 ...
- boost::python的使用
boost::python库是pyhon和c++相互交互的框架,可以再python中调用c++的类和方法,也可以让c++调用python的类和方法 python自身提供了一个Python/C AP ...
- java全栈day02案例
商场库存清单案例 A: 案例分析. * a:观察清单后,可将清单分解为三个部分(清单顶部.清单中部.清单底部) * b:清单顶部为固定的数据,直接打印即可 * c:清单中部为商品,为变化的数据,需要记 ...
- c# 使用protobuf格式操作 Redis
protobuf格式介绍 1.protobuf为goole定义的类似于json的数据格式.2.最终都需要序列化为二进制形式进行传输存储.3.相对于xml,json格式来说,序列化为二进制后占用空间更小 ...
- TCP/IP的三次握手和四次放手
一开始个人对于三次握手和四次挥手这个东西还是有时候会忘记,可能理解的不是非常深刻,所以今天就自己动手来记录一下这个知识点,方便以后查看.总结完之后发现总结的还是可以的哈哈. 三次握手建立连接 第一次: ...
- js/jq基础(日常整理记录)-2-一个简单的js方法实现集合的非引用拷贝
一.一个简单的js方法实现集合拷贝 做web项目的时候,少不了和js中的数组,集合等对象接触,那么你肯定会发现,在js中存在一个怪异的现象就是数组和集合的拷贝都是地址复制,并不是简单的数据的拷贝. 举 ...
- windows脚本设置网络IP地址
需求描述 不通的网络环境下,可能需要设置静态IP地址,或设置为动态获取,每次重复手动的配置费时费力,通过脚本可以实现一键设置 脚本实现 1.设置静态IP 1.1新建文本文档,复制粘贴如下内容 nets ...
- [转]ORA-12516, TNS:listener could not find available handler with matching protocol stack
转至:http://blog.csdn.net/MichaelSrc/article/details/6760247 1.查看当前连接进程数 SQL>select count(*) from v ...