深圳UI培训-高端面授深圳UI培训机构
云和教育:云和数据集团高端IT职业教育品牌
  • 华为
    授权培训中心
  • 腾讯云
    一级认证培训中心
  • 百度营销大学
    豫陕深授权运营中心
  • Oracle甲骨文
    OAEP中心
  • Microsoft Azure
    微软云合作伙伴
  • Unity公司
    战略合作伙伴
  • 普华基础软件
    战略合作伙伴
  • 新开普(股票代码300248)
    旗下丹诚开普投资
  • 中国互联网百强企业锐之旗
    旗下锐旗资本投资

Web Storage是什么?Web Storage详解

  • 发布时间:
    2023-03-27
  • 版权所有:
    云和教育
  • 分享:

Web Storag是HTML5引入的一个非常重要的功能,可以将数据存储在本地,如保存用户的偏好设置、复选框的选中状态、文本框默认填写的值等。用户在浏览器中刷新网页时,网页通过Web Storage就可以知道用户之前所做的一些修改,而不需要将用户修改的内容存储在服务器端。

Web Storage类似于Cookie,但相比Cookie可以减少网络流量,因为Web Storage存储的数据不会发送给服务器,而Cookie存储的数据会由浏览器通过HTTP请求自动发送给服务器。将数据存储在WebStorage可以减少数据在浏览器和服务器间不必要地来回传递。

Web Storage中包含两个关键的对象,分别是localStorage对象和sessionStorage对象,它们都是Web Storage的实例,所以都能使用Web Storage接口提供的方法和属性。localStorage对象用于本地存储,sessionStorage对象用于区域存储。

Web Storage具有以下5个特点:

(1)数据的设置和读取比较方便。

(2)容量较大,可以存储大约5MB数据。

(3)只能存储字符串,如果要存储JSON对象,则可以使用JSON.stringify()和JSON.parseO方法分别进行序列化和反序列化。

(4)本地数据可以即时获得。借助浏览器的缓存,整个页面和数据都可以保存在本地,从本地读数据比通过网络从服务器获得数据快得多,可以立即显示网页中缓存的内容。

(5)数据可以临时存储。很多时候数据只需要在用户浏览单个页面期间使用,关闭页面后数据就可以丢弃,这种情况使用sessionStorage非常方便。

目前,市面上主流的Web浏览器都在一定程度上支持HTML5的Web Storage,且iOS和Android两大平台对Web Storage都具有很好的支持。目前市面上的主流手机和平板计算机都依赖这两个平台,所以在实际开发中,基本不需要担心移动设备的Web浏览器对Web Storage的支持情况。