当前位置: 首页 > news >正文

sessionStorage 能在多个标签页之间共享数据吗?

🧑‍💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣

最近,我的一个朋友在面试中被一个关于 sessionStorage 的问题难住了。我们来聊聊这个话题。
在这里插入图片描述

sessionStorage 能在多个标签页之间共享数据吗?

在回答这个问题之前我们先来聊聊另一个存储API localstorage

localstorage与sessionStorage经常是放在一起讨论,那他们之间的区别是什么呢?

只读的localStorage 属性允许你访问一个Document 源(origin)的对象 Storage;存储的数据将保存在浏览器会话中。localStorage 类似 sessionStorage,但其区别在于:存储在 localStorage 的数据可以长期保留;而当页面会话结束——也就是说,当页面被关闭时,存储在 sessionStorage 的数据会被清除。(这是来自MDN的解释)
那么 localstorage可以在同一网站下共享数据吗?答案显而易见是可以的。

// 你可以在第一个tab里面存储一个数据
localStorage.setItem('name', 'fatfish')
// 在另外一个tab读取这个数据
localStorage.getItem('name') // fatfish

那么sessionStorage呢?

来看看MDN中的解释

  • 页面会话在浏览器打开期间一直保持,并且重新加载或恢复页面仍会保持原来的页面会话。
  • 在新标签或窗口打开一个页面时会复制顶级浏览会话的上下文作为新会话的上下文,这点和 session cookie 的运行方式不同。
  • 打开多个相同的 URL 的 Tabs 页面,会创建各自的 sessionStorage。
  • 关闭对应浏览器标签或窗口,会清除对应的 sessionStorage。

根据第二点,在新打开的页面上应该是可以共享数据的,基于此我本人尝试了一下在掘金主页(juejin.cn/) 下执行以下代码

window.sessionStorage.setItem('canShare','yes')

然后随机打开首页的推荐文章(juejin.cn/post/734279…) 读取数据

window.sessionStorage.getItem('canShare') // null

所以结论是不行,MDN上的解释错了? 我们再做以下测试在掘金主页(juejin.cn/) 下执行以下代码

window.sessionStorage.setItem('canShare','yes');
window.open('https://juejin.cn/post/7342793254096109583', 'aa');

然后随机打开首页的推荐文章(juejin.cn/post/734279…) 读取数据

window.sessionStorage.getItem('canShare') // yes

回过头来我再对掘金首页做以下操作

window.sessionStorage.setItem('canShare','yes');

然后我把推荐文章链接中的target="__blank"属性删除,然后再次点击打开 然后执行

window.sessionStorage.getItem('canShare') // yes

成功的打印出了数据。

结论:

因此,我们可以得出结论:sessionStorage 不能在多个窗口或标签页之间共享数据,但是当通过 window.open 或链接打开新页面时(不能是新窗口),新页面会复制前一页的 sessionStorage。

如果对您有所帮助,欢迎您点个关注,我会定时更新技术文档,大家一起讨论学习,一起进步。

在这里插入图片描述

相关文章:

sessionStorage 能在多个标签页之间共享数据吗?

🧑‍💻 写在开头 点赞 收藏 学会🤣🤣🤣 最近,我的一个朋友在面试中被一个关于 sessionStorage 的问题难住了。我们来聊聊这个话题。 sessionStorage 能在多个标签页之间共享数据吗? 在回答…...

鸿蒙期末项目(完结)

两天仅睡3个小时的努力奋斗之下,终于写完了这个无比拉跨的项目,最后一篇博客总体展示一下本项目运行效果兼测试,随后就是答辩被同学乱沙(悲 刚打开软件,会看到如下欢迎界面,介绍本app的功能和优点 随后我们…...

【Linux】对共享库加载问题的深入理解——基本原理概述

原理概述 【linux】详解——库-CSDN博客 共享库被加载后,系统会为该共享库创建一个结构,这个结构体中的字段描述了库的各种属性。在内存中可能会加载很多库,每一个库都用一个结构体描述。把这些结构体用一些数据结构管理起来,系…...

easyui的topjui前端框架使用指南

博主今天也是第一次点开easyui的商业搜权页面,之前虽然一直在使用easyui前端框架(easyui是我最喜欢的前端ui框架),但是都是使用的免费版。 然后就发现了easyui的开发公司居然基于easyui开发出了一个新的前端框架,于是我…...

Java中的程序异常处理介绍

一、异常处理机制 Java提供了更加优秀的解决办法:异常处理机制。 异常处理机制能让程序在异常发生时,按照代码的预先设定的异常处理逻辑,针对性地处理异常,让程序尽最大可能恢复正常并继续执行,且保持代码的清晰。 Ja…...

Gradle学习-3 Gradle插件

1、Gredle插件是什么 Gradle插件是用于扩展和增强Gradle构建系统的功能模块通过插件,Gradle可以执行各种构建任务,如编译代码、打包应用、运行测试等 Gradle插件主要分为:二进制插件、脚本插件 二进制插件二进制插件是预编译的、可以复用的…...

百度文心智能体,创建属于自己的智能体应用

百度文心智能体平台为你开启。百度文心智能体平台,创建属于自己的智能体应用。百度文心智能体平台是百度旗下的智能AI平台,集成了先进的自然语言处理技术和人工智能技术,可以用来创建属于自己的智能体应用,访问官网链接&#xff1…...

【软件测试】白盒测试与接口测试详解

🍅 视频学习:文末有免费的配套视频可观看 🍅 点击文末小卡片,免费获取软件测试全套资料,资料在手,涨薪更快 一、什么是白盒测试 白盒测试是一种测试策略,这种策略允许我们检查程序的内部结构&a…...

【SpringBoot Web框架实战教程】03 SpingBoot 获取 http 请求参数

不积跬步,无以至千里;不积小流,无以成江海。大家好,我是闲鹤,微信:xxh_1459,十多年开发、架构经验,先后在华为、迅雷服役过,也在高校从事教学3年;目前已创业了…...

Mac14.1.2 M1芯片免费读写ntfs硬盘-亲测有效,免费!!!

1. 安装homebrew 打开终端,使用以下命令 /bin/zsh -c "$(curl -fsSL https://gitee.com/cunkai/HomebrewCN/raw/master/Homebrew.sh)" 根据提示逐步完成即可,镜像选择我这里都是保持1的选项。 2. 重启终端 安装完成homebrew后,需…...

手写SpringMVC之ApplicationContextListener

什么是Spring MVC? Spring Web MVC是基于Servlet API构建的原始Web框架,从一开始就包含在Spring Framework中。正式名称“Spring Web MVC”来自其源模块的名称( spring-webmvc ),但它通常被称为“Spring MVC”。 手写…...

Paimon 在汽车之家的业务实践

汽车之家基于Paimon的实践 摘要:本文分享自汽车之家的王刚、范文、李乾⽼师。介绍了汽车之家基于 Paimon 的一些实践,和一些背景。内容主要为以下四部分: 一、背景 二、业务实践 三、paimon 优化实践 四、未来规划 一、背景 在使用Paimon之前…...

2024-06-27 问AI: 介绍一下 LLM building process

文心一言 LLM(Large Language Model,大语言模型)的构建过程是一个复杂且资源密集的任务,涉及多个关键步骤。以下是LLM构建过程的主要阶段,以及每个阶段的一些关键考虑因素: 数据收集与预处理:…...

猫也有自动厕所上了吗?自费分享好用的智能猫砂盆,看完不亏。

还有人在用普通猫砂盘吗?之前我也是用的普通猫砂盘,但我发现只要我在上班时间,我就无法顾忌到小猫的便便,但又不想回家就闻到一股臭味,更何况现在夏天也快到了,便便残留一会就会发酵发臭,导致生…...

《分析模式》漫谈07-怎样把一张图从不严谨改到严谨

DDD领域驱动设计批评文集 做强化自测题获得“软件方法建模师”称号 《软件方法》各章合集 下图是《分析模式》原书第2章的图2.10,里面有一些错误和考虑不周的地方: 2004中译本和2020中译本的翻译如下: 基本上都是照搬,没有改过…...

纯干货丨知乎广告投放流程和避坑攻略

精准有效的广告投放企业获客的关键,知乎作为中国最大的知识分享平台,拥有着高质量的用户群体和高度的用户粘性,为广告主提供了独一无二的品牌传播与产品推广平台。然而,如何在知乎上高效、精准地进行广告投放,避免不必…...

mac 安装mysql启动报错 ERROR!The server quit without update PID file

发现问题: mac安装mysql初次启动报错: 一般出现这种问题,大多是文件夹权限,或者以前安装mysql卸载不干净导致。首先需要先确定问题出在哪?根据提示我们可以打开mysql的启动目录,查看启动日志。 问题解决&a…...

TypeScrip环境安装与基础

TS环境安装与基础 文章目录 一、什么是TypeScript(微软开发的)二、TypeScript的特性三、环境安装node安装配置详解(常用:outDir,strict ) 四、注释方式五、数据类型 一、什么是TypeScript(微软开…...

6.27学习总结

一、高数 1、斯托克斯公式&#xff08;曲线<->曲面&#xff09;&#xff1a;看清顺时针&#xff08;负&#xff09;/逆时针&#xff08;正&#xff09; 2、曲面方程变二重积分&#xff1a; 前、上、右&#xff1a;正&#xff1b; 后、下、左&#xff1a;负&#xff1b; 3…...

选择第三方软件测试机构做验收测试的好处简析

企事业单位在自行开发完软件系统或委托软件开发公司生产软件之后&#xff0c;有一个必经流程就是验收测试&#xff0c;以验证该产品是否符合用户需求、是否可以上线。为了客观评估所委托生产的软件质量&#xff0c;第三方软件测试机构往往成为企事业单位做验收测试的首选&#…...

从零搭建企业级开源大模型平台:Ollama+Llama3+open-webui实战指南

1. 为什么选择OllamaLlama3open-webui组合&#xff1f; 最近两年大语言模型的发展速度简直让人瞠目结舌&#xff0c;从最初的GPT-3到现在的Llama3&#xff0c;模型能力突飞猛进的同时&#xff0c;部署门槛也在不断降低。作为一个在AI领域摸爬滚打多年的老手&#xff0c;我实测过…...

告别C++复杂配置:5分钟在UE5里搞定一个简单的HTTP客户端

告别C复杂配置&#xff1a;5分钟在UE5里搞定一个简单的HTTP客户端 在独立游戏开发和教育领域&#xff0c;快速验证网络交互功能的需求日益增长。无论是从服务器拉取动态配置&#xff0c;还是提交玩家成绩数据&#xff0c;一个轻量级的HTTP客户端往往能大幅提升原型开发效率。传…...

【深度解析】DeepSeek API 悄然分叉:开发者该如何正确评估与接入最新大模型?

摘要 本文基于近期 DeepSeek API 更新及官方文档变更&#xff0c;从「API 版本 ≠ Web/App 版本」这一关键细节出发&#xff0c;梳理大模型多版本部署策略背后的技术与成本逻辑&#xff0c;并给出基于兼容 OpenAI 协议的实战接入示例&#xff08;使用 claude‑sonnet‑4‑6&…...

AI核心概念串联

目录一、Tokenizer二、LLM三、Context四、RAG五、Prompt六、Tool七、MCP八、Agent九、Skill原UP主视频&#xff1a;从 LLM 到 Agent Skill&#xff0c;一期视频带你打通底层逻辑&#xff01; 一、Tokenizer 用户每次输入都是一串连续的句子&#xff0c;而LLM的最小单位是toke…...

在RK3576开发板上手把手编译并运行你的第一个MPP编码程序(含VSCode配置避坑)

在RK3576开发板上从零构建MPP编码开发环境的完整指南 1. 开发环境准备与交叉编译工具链配置 对于嵌入式开发者而言&#xff0c;RK3576开发板的MPP开发环境搭建需要从基础工具链开始。不同于x86平台的开发&#xff0c;我们需要特别注意交叉编译环境的配置细节。 首先需要获取适用…...

Windows系统下Python 3.11环境配置全攻略

1. Python 3.11环境配置前的准备工作 在开始安装Python 3.11之前&#xff0c;我们需要做一些准备工作。首先确认你的Windows系统版本&#xff0c;右键点击"此电脑"选择"属性"&#xff0c;在系统类型中查看是32位还是64位系统。Python 3.11官方已经停止对32…...

CTP行情接口避坑指南:从‘不合法的登录’到稳定接收tick数据的5个关键步骤

CTP行情接口实战避坑手册&#xff1a;从登录异常到稳定接收tick的深度解决方案 当你在深夜调试CTP行情接口时&#xff0c;突然看到控制台跳出"不合法的登录"错误提示&#xff0c;而距离第二天开盘只剩3小时——这种场景恐怕不少量化开发者都经历过。本文将分享5个关键…...

实战指南:基于Cursor与快马平台,从零搭建一个可用的商品管理后台

今天想和大家分享一个实战项目——用Cursor和InsCode(快马)平台从零搭建商品管理后台的全过程。这个项目麻雀虽小五脏俱全&#xff0c;包含了前后端完整链路&#xff0c;特别适合想练手全栈开发的朋友。 项目架构设计 整个系统采用前后端分离模式。后端用Spring Boot搭建RESTfu…...

保姆级教程:在NUC12Pro上配置Ego_planner无人机自主飞行系统(含D435i与Pixhawk 6C)

在NUC12Pro上构建Ego_planner无人机自主飞行系统的全流程指南 当硬件堆满工作台时&#xff0c;最令人兴奋的莫过于将它们组装成一个能自主思考的飞行系统。本文将带您完成从零搭建基于NUC12Pro、D435i深度相机和Pixhawk 6C飞控的完整解决方案&#xff0c;重点解决那些官方文档从…...

async-http-client原生镜像大小优化:GraalVM裁剪终极指南 [特殊字符]

async-http-client原生镜像大小优化&#xff1a;GraalVM裁剪终极指南 &#x1f680; 【免费下载链接】async-http-client Asynchronous Http and WebSocket Client library for Java 项目地址: https://gitcode.com/gh_mirrors/as/async-http-client 在当今云原生和微服…...