浏览器存储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: 保存的数据长期存在,下一次访问该网站的时候,网页可以直接 ...
随机推荐
- [转]CSS块级元素和行内元素
原地址:http://www.studyofnet.com/news/398.html 本文导读:HTML中的元素可分为两种类型:块级元素和行级元素.这些元素的类型是通过文档类型定义(DTD)来指明. ...
- const与define的区别
const与#define最大的差别,Const在堆栈分配了空间,而#define只是把具体数值 直接传递到目标变量罢了.或者说,const的常量是一个Run-Time的概念,他在程 序中确确实实的存 ...
- 【LeetCode每天一题】Remove Duplicates from Sorted List(移除有序链表中的重复数字)
Given a sorted linked list, delete all duplicates such that each element appear only once. Example 1 ...
- Python lib库docker-py和docker的区别
1)两者的安装方式 pip install docker A Python library for the Docker Engine API pip install docker-py A Pyth ...
- docker常用命令行集锦
对工作中用到的docker命令行进行一个汇总,方便以后的命令行查询,同时也为了加强记忆,会把工作中用到的命令,持续更新上 1.查看私有仓库都有哪些镜像 curl -X GET http://10.27 ...
- 洛谷P2606 [ZJOI2010]排列计数(数位dp)
题目描述 称一个1,2,...,N的排列P1,P2...,Pn是Magic的,当且仅当2<=i<=N时,Pi>Pi/2. 计算1,2,...N的排列中有多少是Magic的,答案可能很 ...
- ELK+Filebeat 实践 Error : read tcp 192.168.0.2:48968->121.40.216.20:5044: i/o timeout
问题描述: 这是一个i/o time 的问题,一般考虑就是磁盘满的问题.以下是我遇到的具体问题: 1.Kibana页面刷新,没有新数据出来,再次刷新或者点击页面上其他地方,kibana就变成这样了: ...
- 《图解HTTP》阅读笔记--第十一章针对web的攻击技术
第十一章.针对WEB的攻击技术 ----<图解HTTP>阅读笔记攻击目标---Web简单的HTTP协议本身并不存在安全性 问题,协议本身并不会成为被攻击的对象,应用HTTP的服务器和客户端 ...
- Glassfish Password Alias
https://docs.oracle.com/cd/E19798-01/821-1751/ghgqc/index.html
- 11.Find All Numbers Disappeared in an Array(找出数组中缺失的数)
Level: Easy 题目描述: Given an array of integers where 1 ≤ a[i] ≤ n (n = size of array), some elements ...