简单介绍浏览器端的几种存储技术

2024-02-13 10:32

本文主要是介绍简单介绍浏览器端的几种存储技术,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

这个问题经常会被问到,在这里简单总结一下~

1、Cookie

cookie是什么:cookie是指存储在用户本地终端上的数据,同时它是与具体的web页面或者站点相关的。cookie数据会自动在web浏览器和web服务器之间传输,也就是说HTTP请求发送时,会把保存在该请求域名下的所有cookie值发送给web服务器,因此服务器端脚本是可以读、写存储在客户端的cookie的操作。

cookie的有效期:cookie默认情况下的有效期是很短暂的,一旦用户关闭浏览器,cookie保存的数据就会丢失。如果想要延长cookie的有效期,可以通过设置HTTP头信息中的cache-control属性的max-age值,或者修改HTTP头信息中的expires属性的值来延长有效期。

cookie的作用域:它是通过文档源和文档路径来确定的。该作用域通过cookie的path和domain属性也是可配置的。默认情况下,cookie和创建它的web页面有关,并对该页面以及和该页面同目录或者子目录的其他页面可见。有时候,你可能希望让整个网站都能够使用cookie的值,而不管是哪个页面创建它。要满足这样的需求可以设置cookie的路径(设置cookie的path属性)。cookie的作用域默认由文档源限制。但是,有的大型网站想要子域之间能够互相共享cookie。

cookie的数目和大小的限制:每个web服务器(域名)保存的cookie数不能超过50个,每个cookie保存的数据不能超过4KB,如果超过了4KB(IE6大约只能存储2K),服务器会处理不了。

cookie的优点:能用于和服务器端通信;当cookie快要过期时,可以重新设置而不是删除。

cookie的缺点:它会随着http头信息一起发送,增加了网络流量(文档传输的负载);它只能储存少量的数据;它只能储存字符串;有潜在的安全问题。

另外,自从有了Web Storage API(Local and Session Storage),cookie就不被推荐用于存储数据了~

2、LocalStorage

localStorage是什么:在HTML5中,新加入了一个localStorage特性,这个特性主要是用来作为本地存储来使用的,解决了cookie存储空间不足的问题(cookie中每条cookie的存储空间为4k),localStorage中一般浏览器支持的是5M大小,这个在不同的浏览器中localStorage会有所不同。

localStorage的优点:

1)localStorage拓展了cookie的4K限制;

2)localStorage会可以将第一次请求的数据直接存储到本地,这个相当于一个5M大小的针对于前端页面的数据库,相比于cookie可以节约带宽,但是这个却是只有在高版本的浏览器中才支持的;

3)localStorage 方法存储的数据没有时间限制。第二天、第二周或下一年之后,数据依然可用。

localStorage的缺点:

1)浏览器的大小不统一,并且在IE8以上的IE版本才支持localStorage这个属性;

2)目前所有的浏览器中都会把localStorage的值类型限定为string类型,这个在对我们日常比较常见的JSON对象类型需要一些转换;

3)localStorage在浏览器的隐私模式下面是不可读取的;

4)localStorage本质上是对字符串的读取,如果存储内容多的话会消耗内存空间,会导致页面变卡;

5)localStorage不能被爬虫抓取到。

3、SessionStorage

sessionStoragelocalStorage的唯一一点区别就是localStorage属于永久性存储,而sessionStorage属于当会话结束的时候,sessionStorage中的键值对就会被清空。

4、UserData、GlobalStorage、Google Gear

这三种的使用都有一定的局限性,例如userData是IE浏览器专属,它的容量可以达到640K,这种方案可靠,不需要安装额外插件,只不过它仅在IE下有效~

globalStorage适用于Firefox 2+的浏览器,类似于IE的userData~

google gear是谷歌开发出的一种本地存储技术,需要安装Gear组件。

5、Flash ShareObject

这种方式能能解决上面提到的cookie存储的两个弊端,而且能够跨浏览器,应该说是目前最好的本地存储方案。不过,需要在页面中插入一个Flash,当浏览器没有安装Flash控件时就不能用了。所幸的是,没有安装Flash的用户极少。

强调一下:cookie,localStorage和sessionStorage的异同:

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

区别:

1)cookie数据始终在同源的http请求中携带(即使不需要),即cookie在浏览器和服务器间来回传递;而sessionStorage和localStorage不会自动把数据发给服务器,仅在本地保存;

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

3)存储大小限制也不同,cookie数据不能超过4k,同时因为每次http请求都会携带cookie,所以cookie只适合保存很小的数据,如会话标识;sessionStorage和localStorage 虽然也有存储大小的限制,但比cookie大得多,可以达到5M或更大;

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

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

6)Web Storage 支持事件通知机制,可以将数据更新的通知发送给监听者;Web Storage 的 api 接口使用更方便。


这篇关于简单介绍浏览器端的几种存储技术的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/705289

相关文章

MySQL常用字符串函数示例和场景介绍

《MySQL常用字符串函数示例和场景介绍》MySQL提供了丰富的字符串函数帮助我们高效地对字符串进行处理、转换和分析,本文我将全面且深入地介绍MySQL常用的字符串函数,并结合具体示例和场景,帮你熟练... 目录一、字符串函数概述1.1 字符串函数的作用1.2 字符串函数分类二、字符串长度与统计函数2.1

python运用requests模拟浏览器发送请求过程

《python运用requests模拟浏览器发送请求过程》模拟浏览器请求可选用requests处理静态内容,selenium应对动态页面,playwright支持高级自动化,设置代理和超时参数,根据需... 目录使用requests库模拟浏览器请求使用selenium自动化浏览器操作使用playwright

Python获取浏览器Cookies的四种方式小结

《Python获取浏览器Cookies的四种方式小结》在进行Web应用程序测试和开发时,获取浏览器Cookies是一项重要任务,本文我们介绍四种用Python获取浏览器Cookies的方式,具有一定的... 目录什么是 Cookie?1.使用Selenium库获取浏览器Cookies2.使用浏览器开发者工具

Linux系统中查询JDK安装目录的几种常用方法

《Linux系统中查询JDK安装目录的几种常用方法》:本文主要介绍Linux系统中查询JDK安装目录的几种常用方法,方法分别是通过update-alternatives、Java命令、环境变量及目... 目录方法 1:通过update-alternatives查询(推荐)方法 2:检查所有已安装的 JDK方

Java中使用 @Builder 注解的简单示例

《Java中使用@Builder注解的简单示例》@Builder简化构建但存在复杂性,需配合其他注解,导致可变性、抽象类型处理难题,链式编程非最佳实践,适合长期对象,避免与@Data混用,改用@G... 目录一、案例二、不足之处大多数同学使用 @Builder 无非就是为了链式编程,然而 @Builder

Python实现终端清屏的几种方式详解

《Python实现终端清屏的几种方式详解》在使用Python进行终端交互式编程时,我们经常需要清空当前终端屏幕的内容,本文为大家整理了几种常见的实现方法,有需要的小伙伴可以参考下... 目录方法一:使用 `os` 模块调用系统命令方法二:使用 `subprocess` 模块执行命令方法三:打印多个换行符模拟

python生成随机唯一id的几种实现方法

《python生成随机唯一id的几种实现方法》在Python中生成随机唯一ID有多种方法,根据不同的需求场景可以选择最适合的方案,文中通过示例代码介绍的非常详细,需要的朋友们下面随着小编来一起学习学习... 目录方法 1:使用 UUID 模块(推荐)方法 2:使用 Secrets 模块(安全敏感场景)方法

zookeeper端口说明及介绍

《zookeeper端口说明及介绍》:本文主要介绍zookeeper端口说明,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录一、zookeeper有三个端口(可以修改)aVNMqvZ二、3个端口的作用三、部署时注意总China编程结一、zookeeper有三个端口(可以

Python中win32包的安装及常见用途介绍

《Python中win32包的安装及常见用途介绍》在Windows环境下,PythonWin32模块通常随Python安装包一起安装,:本文主要介绍Python中win32包的安装及常见用途的相关... 目录前言主要组件安装方法常见用途1. 操作Windows注册表2. 操作Windows服务3. 窗口操作

浏览器插件cursor实现自动注册、续杯的详细过程

《浏览器插件cursor实现自动注册、续杯的详细过程》Cursor简易注册助手脚本通过自动化邮箱填写和验证码获取流程,大大简化了Cursor的注册过程,它不仅提高了注册效率,还通过友好的用户界面和详细... 目录前言功能概述使用方法安装脚本使用流程邮箱输入页面验证码页面实战演示技术实现核心功能实现1. 随机