本地存储——Cookie与Web Storage

mating 发布于2019-08-20 16:17 / 1106人阅读

摘要：是客户端用来存储数据的它既可以在客户端设置也可以在服务器端设置。会跟随任意请求一起发送标准中的包括了两种存储方式和用于本地存储一个会话中的数据，这些数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁。

Cookie

cookie是客户端用来存储数据的,它既可以在客户端设置也可以在服务器端设置。cookie会跟随任意HTTP请求一起发送

Web Storage

html5标准中的Web Storage包括了两种存储方式:sessionStorage和localStorage
sessionStorage用于本地存储一个会话中的数据，这些数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁。因此sessionStorage仅仅是会话级别的存储
而localStorage用于持久化的本地存储，除非主动删除数据，否则数据是永远不会过期的

区别

Web Storage和Cookie相似都是客户端用来存储数据的，区别是它是为了更大容量存储设计的
Cookie的大小是受限的，最多只能存储4KB的数据；并且每次你请求一个新的页面的时候，Cookie都会被发送过去，这样无形中浪费了带宽；再有就是不安全，很容易被拦截者截取进行篡改
Web Storage拥有setItem、getItem、removeItem、clear等方法，不像cookie需要自己封装setCookie、getCookie等方法
但是Cookie也是不可以或缺的:Cookie的作用是与服务器进行交互，作为HTTP规范的一部分而存在，而Web Storage仅仅是为了在本地存储数据而生

操作方法

setItem

sessionStorage.setItem("name","leoyaojy");
localStorage.setItem("website","luckyw.cn");

getItem

sessionStorage.getItem("name");        //leoyaojy
localStorage.getItem("website");    //luckyw.cn

removeItem

sessionStorage.removeItem("name");
localStorage.removeItem("website");

clear

sessionStorage.clear();
localStorage.clear();

其他操作方法:点操作和[]

sessionStorage.name = "leoyaojy";
console.log(sessionStorage["name"]);

localStorage["website"] = "luckyw.cn";
console.log(localStorage.website);

key()和length遍历数据

for (var i=0, len = localStorage.length; i
                 
                                                                                                                    
                         私有云
                                             
                         云服务器
                                                                                                                                                 
                                      
                     
                    
                                                                                               本地存储与云存储区别
                                                                                                           服务器本地存储与云端存储
                                                                                                           云服务器与本地存储
                                                                                                           js本地cookie保存数据

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/82833.html

Web Storage 与cookies

摘要：和虽然也有存储大小的限制，但比大得多，可以达到或更大支持事件通知机制，可以将数据更新的通知发送给监听者。有时也用，指某些网站为了辨别用户身份，进行跟踪而存储在本地终端上的数据，通常经过加密。 Web Storage介绍 Web Storage带来的好处减少网络流量：一旦数据保存在本地后，就可以避免再向服务器请求数据，因此减少不必要的数据请求，减少数据在浏览器和服务器间不必要地来回传...

zhkai 2019-08-01 18:02 评论0 收藏0
Web Storage 与cookies

摘要：和虽然也有存储大小的限制，但比大得多，可以达到或更大支持事件通知机制，可以将数据更新的通知发送给监听者。有时也用，指某些网站为了辨别用户身份，进行跟踪而存储在本地终端上的数据，通常经过加密。 Web Storage介绍 Web Storage带来的好处减少网络流量：一旦数据保存在本地后，就可以避免再向服务器请求数据，因此减少不必要的数据请求，减少数据在浏览器和服务器间不必要地来回传...

Achilles 2019-08-29 13:51 评论0 收藏0
浏览器本地存储

摘要：浏览器本地存储在较高版本的浏览器中，提供了和。单个保存的数据不能超过，很多浏览器都限制一个站点最多保存个。浏览器本地存储在较高版本的浏览器中，js提供了sessionStorage和globalStorage。在HTML5中提供了localStorage来取代globalStorage html5中的Web Storage包括了两种存储方式：sessionStorage和loca...

oysun 2019-08-22 15:58 评论0 收藏0
左手Cookie“小甜饼”，右手Web Storage

摘要：源自阮一峰具体什么意思，请看下面的截图就一目了然表示对象的的数量实战网站名网站地址确认网站名查询机制原意是小甜饼，是服务器保存在浏览器的一小段文本信息，属于其中一种互联网存储机制。目录 1. Web Storage 2. Cookie机制 3. 二者的联系与区别 1.Web Storage 1.1 概述 Web Storage是HTML5提供的一种新的浏览器端数据储存机制，它提供两...

Nekron 2019-08-21 11:16 评论0 收藏0