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

共同点:

都是保存在浏览器端,且同源的。

区别:

  1. cookie 数据始终在同源的 http 请求中携带(即使不需要),即 cookie 在浏览器和服务器间来回传递。而 sessionStorage 和 localStorage 不会自动把数据发给服务器,仅在本地保存。
  2. 存储大小限制不同。cookie 数据不能超过4k,同时因为每次http请求都会携带 cookie,所以 cookie 只适合保存很小的数据,如会话标识。sessionStorage 和 localStorage 虽然也有存储大小的限制,但比 cookie 大得多,可以达到5M或更大。

  3. 数据有效期不同。sessionStorage:仅在当前浏览器窗口关闭前有效,自然也就不可能持久保持;localStorage:始终有效,窗口或浏览器关闭也一直保存,因此用作持久数据;cookie只在设置的 cookie 过期时间之前一直有效,即使窗口或浏览器关闭。

  4. 作用域不同。sessionStorage 不在不同的浏览器窗口中共享,即使是同一个页面;localStorage 在所有同源窗口中都是共享的;cookie 也是在所有同源窗口中都是共享的。

  5. cookie 数据有路径(path)的概念,可以限制 cookie 只属于某个路径下。

  6. Web Storage 支持事件通知机制,可以将数据更新的通知发送给监听者。

  7. Web Storage 的 api 接口使用更方便。

cookie sessionStorage localStorage 区别的更多相关文章

  1. session,cookie,sessionStorage,localStorage的区别及应用场景

    session,cookie,sessionStorage,localStorage的区别及应用场景 浏览器的缓存机制提供了可以将用户数据存储在客户端上的方式,可以利用cookie,session等跟 ...

  2. 缓存session,cookie,sessionStorage,localStorage的区别

    https://www.cnblogs.com/cencenyue/p/7604651.html(copy) 浅谈session,cookie,sessionStorage,localStorage的 ...

  3. 彻底弄清楚session,cookie,sessionStorage,localStorage的区别及应用场景(面试向)

    原文转载自「刘悦的技术博客」https://v3u.cn/a_id_94 客户端状态保持是一个老生常谈的问题了,归根结底追踪浏览器的用户身份及其相关数据无非就是以下四种方式:session,cooki ...

  4. cookie,sessionStorage,localStorage

    本文转 sessionStorage 和 localStorage 是HTML5 Web Storage API 提供的,可以方便的在web请求之间保存数据.有了本地数据,就可以避免数据在浏览器和服务 ...

  5. 浅谈session,cookie,sessionStorage,localStorage的区别及应用场景

    浏览器的缓存机制提供了可以将用户数据存储在客户端上的方式,可以利用cookie,session等跟服务端进行数据交互. 一.cookie和session cookie和session都是用来跟踪浏览器 ...

  6. session,cookie,sessionStorage,localStorage的区别

    浏览器的缓存机制提供了可以将用户数据存储在客户端上的方式,可以利用cookie,session等跟服务端进行数据交互. 一.cookie和session cookie和session都是用来跟踪浏览器 ...

  7. [转] 浅谈session,cookie,sessionStorage,localStorage的区别及应用场景

    浏览器的缓存机制提供了可以将用户数据存储在客户端上的方式,可以利用cookie,session等跟服务端进行数据交互. 一.cookie和session cookie和session都是用来跟踪浏览器 ...

  8. 本地存储(cookie&sessionStorage&localStorage)

    好文章,最全面.就查它吧:https://segmentfault.com/a/1190000004556040 1.DOM存储:https://developer.mozilla.org/zh-CN ...

  9. session,cookie,sessionStorage,localStorage的相关设置以及获取删除

    一.cookie 什么是 Cookie? "cookie 是存储于访问者的计算机中的变量.每当同一台计算机通过浏览器请求某个页面时,就会发送这个 cookie.你可以使用 JavaScrip ...

随机推荐

  1. React Native组件之ScrollView 和 StatusBar和TabBarIos

    React Native中的组件ScrollView类似于iOS中的UIScrollView,其基本的使用方法和熟悉如下: /** * Sample React Native App * https: ...

  2. Counting Sequences_线段树***

    Description For a set of sequences of integers{a1,a2,a3,...an}, we define a sequence{ai1,ai2,ai3...a ...

  3. Linux内核分析——跟踪分析Linux内核的启动过程

    万子惠 + 原创作品转载请注明出处 + <Linux内核分析>MOOC课程 实验部分 menu程序: cd LinuxKernel/ qemu -kernel linux-3.18.6/a ...

  4. Day17_集合第三天

    1.HashSet类(掌握) 1.哈希值概念      哈希值:哈希值就是调用对象的hashCode()方法后返回的一个int型数字      哈希桶:简单点理解就是存储相同哈希值对象的一个容器 1. ...

  5. input屏蔽历史记录

    设置input 的扩展属性 autocomplete为off即可 <input type="text" autocomplete="off" />

  6. WOJ-1097

    Description JYY has placed N bombs on the plane. We assume that the firepower area of each bomb is c ...

  7. java SpringUtil获取bean

    package com.whaty.framework.common.spring; import java.io.PrintStream; import org.springframework.be ...

  8. chrome 49 版本 跨越 --args --disable-web-security --user-data-dir

    转载: 做前端的,用Ajax获取数据,是常有的事情,同域下自然没问题了,如果是不同域获取数据,浏览器就有个同源策略的限制. 如图: Origin * is not allowed by Access- ...

  9. find命令学习

    find命令与locate命令的区别: locate: 非实时查找: 依赖于索引,而索引构建非常占用资源,索引的创建是在系统空闲时系统自动进行,可以用updatedb命令更新索引: 查找速度快: 非精 ...

  10. bll编译错误

    如果在项目中 ,bll有函数,却引用报错 原因很可能是因为bll在生成程序集的时候,没有生成好.其中有错误 解决办法. 1.将bll,web,dal重新生成 2.注意bll的生成,该添加的添加,该排除 ...