目录
- 原始存储方式
- 工作原理
- 用途
- 缺点
- html5全新存储技术——web storage
- localStorage
- sessionStorage
- localStorage和sessionStorage的区别
页面存储:将数据存储在客户端。
它实际上是一种会话跟踪技术——http协议是一种无状态协议(数据包的发送、传输和接收都是相互独立的),服务器要确定发送请求的客户端必须使用会话跟踪技术。
原始存储方式
原始的存储通过Cookie方式存储。
工作原理
用户第一次访问服务器时,服务器产生的信息以Cookie形式发送给浏览器,用户客户端接收到之后,Cookie信息被保存到浏览器的缓冲区中。当用户通过浏览器再次访问服务器时,会先从本地磁盘加载出Cookie信息,连同访问请求一起发送给服务器,服务器可以通过Cookie信息分辨出当前请求是哪个用户发出的。
用途
(1)存储用户在特定网站上的登录账号、密码等信息(设置登录有效期、记住密码等)
(2)网页个性化设置(选择网站的样式)
(3)网站跟踪用户的访问过程(访问哪些网页,访问时间等)
缺点
(1)Cookie被附加在HTTP消息中,无形中增加了数据流量。
(2)Cookie在HTTP消息中是明文传输的,所以安全性不高,容易被窃取。
(3)Cookie存储于浏览器,可以被篡改,服务器接收后必须先验证数据的合法性。
(4)浏览器限制Cookie的数量和大小(通常限制为50个,每个不超过4KB),对于复杂的存储需求来说是不够用的。
html5全新存储技术——web storage
localStorage
localStorage(长期存储):是H5新增的页面存储技术,用来替换cookie,解决cookie容量太小的问题(cookie容量是4k),localStorage的容量是5M,以key-value方式存储数据,长期存储数据,浏览器关闭之后,数据仍然存在。
localStorage主要作用是持久化的本地存储。
本地存储是指将数据按照键值对的方式保存在客户端计算机中,直到用户或者脚本主动清除数据,否则该数据会一直存在。
sessionStorage
session:会话
Web开发中,一次绘画是指从一个浏览器窗口打开到关闭的期间,当用户关闭浏览器,会话就将结束。
sessionStorage(临时存储):为每个数据源维护一个存储区域,在浏览器打开期间该存储区域就存在,在浏览器关闭之后该存储区域被释放。
数据存储在浏览器的内存中,当浏览器关闭时,内存中的数据会自动清除。其生命周期和会话的生命周期相同。
localStorage和sessionStorage的区别
(1)生命周期不同:localStorage是永久性的,sessionStorage的生命周期和会话相同,会话结束时数据消失。
(2)存储位置不同:localStorage存储在硬盘上,sessionStorage存储在浏览器内存中(浏览器缓存中),当浏览器关闭后,内存将被自动清除。