发表于: 2019-09-27 20:57:04

1 813


今天完成的事情:

1.进行小课堂的准备,差点给忘记了:

基本概念

cookie英文饼干,顾名思义,大小应该非常小,cookie非常小,它的大小限制在4kb左右,是网景公司的前雇员在1993年发明。它的主要用于保存登陆信息,比如你登陆某个网站市场可以看到'记住密码’,这就是通过在cookie中存入一段辨别用户身份的数据来实现的。

localStorage

localStorage是HTML5标准中新加入的技术,当然早在IE6时代就有一个userData的东西用于本地存储,而当时考虑到浏览器的兼容性,更通用的方案是使用flash。如今localStorage被大多数浏览器所支持。

sessionStorage

sessionStorage与localStorage的接口类似,但保存数据的生命周期与localStorage不同,做过后端的同学都知道Session这个词,翻译过来就是会话。而sessionStorage是前端的一个概念。它只是可以将一部分数据在当前会话中保存下来,刷新页面数据依旧存在。但是叶敏啊关闭后,sessionStorage中的数据就会被清空。

三者的异同

数据上的生命周期的不同

Cookie 一般由服务器生成,可设置失效时间,如果在浏览器端生成cookie,默认是关闭后失效。

localStorage 除非被永久清除,否则永久保存。

sessionStorage 仅在当前会话会有效,关闭页面或浏览器后被清除

存放数据的大小不同

Cookie 一般为4kb

localStorage 和 sessionStorage 一般为5mb

与服务器端通信不同

Cookie 每次都会携带HTTP头中,如果使用cookie保存过多数据会带来性能问题

localStorage 和 sessionStorage 仅在客户端(即浏览器)中保存,不参与和服务器的通信。

易用性

Cookie 需要程序员自己来封装,原生的cookie接口不够友好

localStorage 和 sessionStorage 原生接口可以接受,可以封装来对Object和Array有更好的支持。


WebStorage的其他优点:

(1)节省网络流量:WebStorage不会传送到服务器,存储在本地的数据可以直接获取,也不会像cookie一样美词请求都会传送到服务器,所以减少了客户端和服务器端的交互,节省了网络流量;

(2)对于那种只需要在用户浏览一组页面期间保存而关闭浏览器后就可以丢弃的数据,sessionStorage会非常方便;

(3)快速显示:有的数据存储在WebStorage上,再加上浏览器本身的缓存。获取数据时可以从本地获取会比从服务器端获取快得多,所以速度更快;

(4)安全性:WebStorage不会随着HTTP header发送到服务器端,所以安全性相对于cookie来说比较高一些,不会担心截获,但是仍然存在伪造问题;

(5)WebStorage提供了一些方法,数据操作比cookie方便;

    setItem (key, value) ——  保存数据,以键值对的方式储存信息。

         getItem (key) ——  获取数据,将键值传入,即可获取到对应的value值。

          removeItem (key) ——  删除单个数据,根据键值移除对应的信息。

          clear () ——  删除所有的数据

          key (index) —— 获取某个索引的key


明天计划:

1.再看看小课堂有什么需要补充的添加一下,也不要扯的太远,然后加速进行图片添加的功能


返回列表 返回列表
评论

    分享到