当前位置: 首页 > 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;第三方软件测试机构往往成为企事业单位做验收测试的首选&#…...

利用最小二乘法找圆心和半径

#include <iostream> #include <vector> #include <cmath> #include <Eigen/Dense> // 需安装Eigen库用于矩阵运算 // 定义点结构 struct Point { double x, y; Point(double x_, double y_) : x(x_), y(y_) {} }; // 最小二乘法求圆心和半径 …...

Linux链表操作全解析

Linux C语言链表深度解析与实战技巧 一、链表基础概念与内核链表优势1.1 为什么使用链表&#xff1f;1.2 Linux 内核链表与用户态链表的区别 二、内核链表结构与宏解析常用宏/函数 三、内核链表的优点四、用户态链表示例五、双向循环链表在内核中的实现优势5.1 插入效率5.2 安全…...

AtCoder 第409​场初级竞赛 A~E题解

A Conflict 【题目链接】 原题链接&#xff1a;A - Conflict 【考点】 枚举 【题目大意】 找到是否有两人都想要的物品。 【解析】 遍历两端字符串&#xff0c;只有在同时为 o 时输出 Yes 并结束程序&#xff0c;否则输出 No。 【难度】 GESP三级 【代码参考】 #i…...

ETLCloud可能遇到的问题有哪些?常见坑位解析

数据集成平台ETLCloud&#xff0c;主要用于支持数据的抽取&#xff08;Extract&#xff09;、转换&#xff08;Transform&#xff09;和加载&#xff08;Load&#xff09;过程。提供了一个简洁直观的界面&#xff0c;以便用户可以在不同的数据源之间轻松地进行数据迁移和转换。…...

python如何将word的doc另存为docx

将 DOCX 文件另存为 DOCX 格式&#xff08;Python 实现&#xff09; 在 Python 中&#xff0c;你可以使用 python-docx 库来操作 Word 文档。不过需要注意的是&#xff0c;.doc 是旧的 Word 格式&#xff0c;而 .docx 是新的基于 XML 的格式。python-docx 只能处理 .docx 格式…...

鸿蒙中用HarmonyOS SDK应用服务 HarmonyOS5开发一个生活电费的缴纳和查询小程序

一、项目初始化与配置 1. 创建项目 ohpm init harmony/utility-payment-app 2. 配置权限 // module.json5 {"requestPermissions": [{"name": "ohos.permission.INTERNET"},{"name": "ohos.permission.GET_NETWORK_INFO"…...

RNN避坑指南:从数学推导到LSTM/GRU工业级部署实战流程

本文较长&#xff0c;建议点赞收藏&#xff0c;以免遗失。更多AI大模型应用开发学习视频及资料&#xff0c;尽在聚客AI学院。 本文全面剖析RNN核心原理&#xff0c;深入讲解梯度消失/爆炸问题&#xff0c;并通过LSTM/GRU结构实现解决方案&#xff0c;提供时间序列预测和文本生成…...

DeepSeek 技术赋能无人农场协同作业:用 AI 重构农田管理 “神经网”

目录 一、引言二、DeepSeek 技术大揭秘2.1 核心架构解析2.2 关键技术剖析 三、智能农业无人农场协同作业现状3.1 发展现状概述3.2 协同作业模式介绍 四、DeepSeek 的 “农场奇妙游”4.1 数据处理与分析4.2 作物生长监测与预测4.3 病虫害防治4.4 农机协同作业调度 五、实际案例大…...

在web-view 加载的本地及远程HTML中调用uniapp的API及网页和vue页面是如何通讯的?

uni-app 中 Web-view 与 Vue 页面的通讯机制详解 一、Web-view 简介 Web-view 是 uni-app 提供的一个重要组件&#xff0c;用于在原生应用中加载 HTML 页面&#xff1a; 支持加载本地 HTML 文件支持加载远程 HTML 页面实现 Web 与原生的双向通讯可用于嵌入第三方网页或 H5 应…...

免费PDF转图片工具

免费PDF转图片工具 一款简单易用的PDF转图片工具&#xff0c;可以将PDF文件快速转换为高质量PNG图片。无需安装复杂的软件&#xff0c;也不需要在线上传文件&#xff0c;保护您的隐私。 工具截图 主要特点 &#x1f680; 快速转换&#xff1a;本地转换&#xff0c;无需等待上…...