sessionStorage 和 localStorage 是HTML5 Web Storage API 提供的,可以方便的在web请求之间保存数据。有了本地数据,就可以避免数据在浏览器和服务器间不必要地来回传递。

cookie

cookie在浏览器和服务器间来回传递,主要应用场景:

  • 保持登录
  • 保持上次查看的页面
  • 浏览计数
  • 广告追踪
  • 购物车的状态保持

Cookies是如何起效的?

当浏览器从web的回应到页面请求中接收到一个 Set-Cookie 头部时Cookies便创建了:

HTTP/1.1 200 OK
Content-type: text/html
Set-Cookie: page_loaded=25; Expires=Wed, 09 Jun 2021 10:18:14 GMT

浏览器接收到表明回应成功的 HTTP 200 代码,以及回应的内容类型。同时也接收到了 Set-Cookie头部,并创建了一个的cookie:

Name Value Expires
page_loaded 25 Wed, 09 Jun 2021 10:18:14 GMT

除非在Wed, 09 Jun 2021 10:18:14前刷新,否则cookie将在这以后无效并被浏览器移除。如果它没有被终止,在将来所有的该网站的请求中都将携带类似的信息头部:

GET /spec.html HTTP/1.1
Host: www.example.org
Cookie: page_loaded=25;

cookie一直在潜在隐私和安全影响方面有一个坏名声。他们很容易受到安全问题攻击影响,例如关键攻击载体的CSRF(Cross Site Request Forgery),XSS(Cross Site Scripting Attacks) 以及 Session Hijacking 。一个用功且专业的开发者也许不会把很多安全细节信息放在cookie中,或者实现一系列的方法来减轻可能的这些形式的攻击。


WebStorage

HTML5引入了Web Storage作为Cookies的替代,这种存储有两种类型:local 和 session:

Web Storage 的缺陷

  • 数据以简单字符串存储;操作所需的存储不同类型的对象,例如booleans,objects,ints和floats。

  • 默认5MB存储限制;如果需要时可有用户允许获取更多存储。

  • 可被用户或者系统管理员禁用

  • 复杂数据集合存储可能很慢

Web Storage 的长处

  • App 可以再在线或离线情况下使用

  • 拥有简单好用易学的API

  • 能够对浏览器使用事件钩子,例如offline,online,storage change

  • 比cookies更便于管理,没有额外的的请求头部数据

  • 提供更大的空间以存贮日益剧增的复杂数据

Web Storage API

Web Storage API 简单易学,它只包含四个方法:

sessionStorage、localStorage、cookie都是在浏览器端存储的数据,其中sessionStorage的概念很特别,引入了一个“浏览器窗口”的概念。sessionStorage是在同源的同窗口(或tab)中,始终存在的数据。也就是说只要这个浏览器窗口没有关闭,即使刷新页面或进入同源另一页面,数据仍然存在。关闭窗口后,sessionStorage即被销毁。同时“独立”打开的不同窗口,即使是同一页面,sessionStorage对象也是不同的。

Web Storage带来的好处:减少网络流量:一旦数据保存在本地后,就可以避免再向服务器请求数据,因此减少不必要的数据请求,减少数据在浏览器和服务器间不必要地来回传递。快速显示数据:性能好,从本地读数据比通过网络从服务器获得数据快得多,本地数据可以即时获得。再加上网页本身也可以有缓存,因此整个页面和数据都在本地的话,可以立即显示。临时存储:很多时候数据只需要在用户浏览一组页面期间使用,关闭窗口后数据就可以丢弃了,这种情况使用sessionStorage非常方便。

WebStorage 和 Cookie的区别的更多相关文章

  1. webStorage和cookie的区别

    共同点:         都是保存在浏览器端,且同源的   cookie有什么缺点? Cookie数量和长度的限制.每个domain最多只能有20条cookie,每个cookie长度不能超过4KB 安 ...

  2. session与cookie的区别以及HTML5中WebStorage理解

    一.session与cookie的区别 二.HTML5中WebStorage理解 WebStorage的目的是克服由cookie所带来的一些限制,当数据需要被严格控制在客户端时,不需要持续的将数据发回 ...

  3. localStorage、sessionStorage和cookie的区别

    本地客户端(浏览器)查看三者信息: HTML4的本地存储:cookie 浏览器的缓存机制提供了可以将用户数据存储在客户端上的方式,可以利用cookie,session等根服务端进行数据交互. 一.co ...

  4. session和cookie的区别

    cookie机制和session机制的区别     具体来说cookie机制采用的是在客户端保持状态的方案,而session机制采用的是在服务器端保持状态的方案.     同时我们也看到,由于才服务器 ...

  5. 详解SESSION与COOKIE的区别

    在PHP面试中 经常碰到请阐述session与cookie的区别与联系,以及如何修改两者的有效时间. 大家都知道,session是存储在服务器端的,cookie是存储在客户端的,session依赖于c ...

  6. session 和 cookie 的区别与联系

    1.创建一个新的Cookie Cookie cookie = new Cookie("username",name); 2.设置cookie在客户端上存活多久 cookie.set ...

  7. session与cookie的区别,有哪些不同之处

    session与cookie的区别,根据自己的理解总结如下: (1)cookie是一种客户端的状态管理技术,将状态写在 浏览器端,而session是一种服务器端的状态管理技术,将 状态写在web服务器 ...

  8. session与cookie的区别【转】

    我所知道的有以下区别:       1.session保存在服务器,客户端不知道其中的信息:cookie保存在客户端,服务器能够知道其中的信息.       2.session中保存的是对象,cook ...

  9. session与cookie的区别与联系

    session与cookie是在做项目中很常用的会话技术,session与cookie也是面试中被问到频率最高的问题,有一次我去面试,面试官就怼着我session与cookie一直问(头都大了),下面 ...

随机推荐

  1. webApp--cordova 系列1

    1.在node,npm 可用的前提下 npm install -g cordova 大约10分钟后装完,cmd中输入cordova -v  验证是否安装成功 2.cordova项目打包是用ant完成, ...

  2. 传智播客JavaWeb day09-mysql入门、数据库操作、数据库表操作、数据行操作

    不知不觉已到了第九天了,今天主要讲了关系数据库的基本概述.安装.数据库.表和数据行的操作 1. 基本概述 1.1 数据库就是用来存储数据的.早期是存在文件里面的操作起来效率低而且不是很安全. 1.2 ...

  3. G - YY's new problem(HUSH算法,目前还不懂什么是HUSH算法)

      Time Limit:4000MS     Memory Limit:65536KB     64bit IO Format:%I64d & %I64u Submit Status Pra ...

  4. 转 C# DataTable 和List之间相互转换的方法

    一.List/IEnumerable转换到DataTable/DataView 方法一: /// <summary> /// Convert a List{T} to a DataTabl ...

  5. JS URL参数传递 谷歌乱码解决

    //第一个页面 var name=encodeURIComponent("参数"); var url="test1.html?name="+name; //第二 ...

  6. Java笔记5-修饰符,重载,递归,数组

    方法的定义修饰符 返回类型 方法名(参数列表) throws 异常类型列表 { //方法体}==如何来设计一个方法:案例:请根据如下的业务分别设计出方法1.根据给定的年份判断是否是闰年?public ...

  7. java端口扫描(原创)

    项目需要扫描占用的端口来判断服务是否启动,通过查资料发现大多数方法都是ServerSocket socket = new ServerSocket(port);代码如下: package com.fr ...

  8. supervisor使用详解

    1.什么是supervisorsupervisor是用python写的一个进程管理工具,用来启动,重启,关闭进程. 2.supervisor的安装 pip install supervisor 3.s ...

  9. python编码-2

    字典 >>> aa={} >>> aa['wo']=[1,2,3,4] >>> aa['ni']=[5,6,7,8] >>> a ...

  10. SocketTcpClient

    public class SocketTcpClient { public static string ErrorMsg = string.Empty; private static Socket _ ...