HTML5编程之旅第6站Web Storage

分手后的思念是犯贱 2022-01-14 11:03 111阅读 0赞

[2019独角兽企业重金招聘Python工程师标准>>> ][2019_Python_] ![hot3.png][]

Web Storage，有时也称为DOMStorage，它提供在Web请求之间持久化数据，在此之前，远程Web服务器需要存储客户端和服务器间交互使用的所有相关数据。利用Web Storage，开发者可以将需要跨请求重复访问的数据直接存储在客户端的浏览器中，且可以在关闭浏览器很久后再次打开时恢复数据，以减少网络流量。

一、Web Storage概述

cookie可以称之为Web Storage的前身，但是cookie存在如下限制：

cookie的大小受限制；只要有请求涉及cookie，cookie就需要在服务器和浏览器之间进行传送。

二、Web Storage API

1、浏览器支持

使用window.sessionStorage和window.localStorage可以检查浏览器是否支持Web Storage。

2、设置和获取数据

设置数据

window.sessionStorage.setItem("myFirstKey","myFirstValue")

window.sessionStorage.myFirstKey="myFirstValue"

获取数据

window.sessionStorage.getItem("myFirstKey")

window.sessionStorage.myFirstKey

sessionStorage可以使得不同的页面获取同意的值，只要这些网页是同源的。

3、封堵数据泄露

对于设置到sessionStorage中的对象，只要浏览器窗口不关闭，它们就会一直存在。当用户关闭窗口或浏览器时sessionStorage的数据将被清除。

sessionStorage非常适用于短时存在的流程中，如对话框和向导。如果数据需要存储在多个页面中，同时又不希望用户下一次访问应用程序时重新部署，则可将这些数据存储在sessionStorage，其可以避免来回传递。

sessionStorage还解决了一个web应用程序的问题：数据作用域。

4、localStorage和sessionStorage

二者区别是：一是名称不同；二是数据的保存时长及他们的共享方式。

转载于:https://my.oschina.net/niweiwei/blog/212696

[2019_Python_]: https://my.oschina.net/u/2663968/blog/3061697
[hot3.png]: /images/20220114/a07f2a0dbc9e460e933871193d52ee23.png

发表评论取消回复

表情：

评论列表（有 0 条评论，111人围观）

还没有评论，来说两句吧...

相关阅读

相关 HTML5实战与剖析之Web存储机制(Web Storage)

　　Web Storage是以Key-Value的形式进行数据持久性存储。Web Storage是为了克服由cookie带来的一些限制而产生的。当数据需要被严格控制在客户端上的

超、凢脫俗/ 2022年09月20日 08:49/ 0 赞/ 127 阅读

相关 html5 Web storage

web storage可以以key/value的方式保存数据，让我们的app在离线的情况下，依然可以读取上次浏览的记录。 web storage 和 cookie的区别 1

缺乏、安全感/ 2022年08月21日 04:19/ 0 赞/ 180 阅读

相关 HTML5 Web Storage用法

<!DOCTYPE html > <head> <title>演示HTML5 Web Storage的用法</title

桃扇骨/ 2022年08月13日 17:33/ 0 赞/ 216 阅读

相关 HTML5本地存储之Web Storage篇

<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"/>

曾经终败给现在/ 2022年08月06日 00:25/ 0 赞/ 195 阅读

相关 HTML5中Web Storage

cookie可以在客户端保存诸如用户名等简单的用户信息，主要的问题：大小：cookie的大小被限制在4KB 带宽：cookie是随着HTTP事务一起被发送的，因此会浪

￡神魔★判官ぃ/ 2022年07月13日 00:17/ 0 赞/ 219 阅读

相关 HTML5 Web Storage

HTML5 提供了两种在客户端存储数据的新方法： localStorage 没有时间限制的数据存储。 sessionStorage 针

迈不过友情╰/ 2022年07月11日 16:02/ 0 赞/ 192 阅读

相关 HTML5客户端存储Web Storage

1. Web Storage 支持情况：IE8以上的主流浏览器都支持Web Storage，IOS平台和Android平台对Web Storage都有很好的支持。 loca

ゝ一世哀愁。/ 2022年05月11日 01:04/ 0 赞/ 358 阅读

相关 Html5 Storage Web SQL 示例

Web sql 是在浏览器模拟数据库，可以使用JS来操作SQL完成对数据的读写，但是这个东西目前支持的浏览器不多，而且其W3C规范已经停止支持. 支持的浏览器以及版本：

左手的ㄟ右手/ 2022年04月25日 05:04/ 0 赞/ 206 阅读

相关 HTML5本地存储之Web Storage篇

Web Storage是HTML5引入的一个非常重要的功能，可以在客户端本地存储数据，类似HTML4的cookie，但可实现功能要比cookie强大的多，cookie大小被限制

忘是亡心i/ 2022年04月12日 03:59/ 0 赞/ 226 阅读

相关 HTML5编程之旅第6站Web Storage

[2019独角兽企业重金招聘Python工程师标准>>> ][2019_Python_] ![hot3.png][] Web Storage，有时也称为DOMStorage，

分手后的思念是犯贱/ 2022年01月14日 11:03/ 0 赞/ 112 阅读