什么?sessionStorage可以跨页签?

99%的前端都知道,sessionStorage可以不可以跨页签共享。即便是同一个域名,打开两个浏览器页签,sessionStorage相互独立,各自维护自己的sessionStorage。

然而,MDN介绍了一种特殊情况

在新标签或窗口打开一个页面时会复制顶级浏览会话的上下文作为新会话的上下文,这点和 session cookie 的运行方式不同。

也就是从一个窗口打开另一个同源窗口时,新窗口会带上原窗口的sessionStorage。

举个栗子

在当前窗口设置sessionStorage

通过window.open('http://localhost:3000/','_blank')打开新窗口时会带上原sessionStorage:

但是这并不意味着sessionStorage可以跨页签共享!

在其中一个窗口修改sessionStorage,另一个窗口的sessionStorage并不会跟着改变

因此,当使用sessionStorage作标记判断,且存在用户打开多窗口场景时,需要注意sessionStorage的跨页签

相关推荐
小蜜蜂dry13 小时前
nestjs学习 - 管道(pipe)
前端·nestjs
梦鱼13 小时前
🖥️ 告别 Electron 托盘图标模糊:一套精准的 PNG 生成方案
前端·electron
张元清13 小时前
React Hooks 性能优化:如何避免不必要的重新渲染
前端·javascript·面试
不甜情歌13 小时前
JavaScript this绑定规则:告别踩坑指南!
前端·javascript
小J听不清13 小时前
CSS 三种引入方式全解析:行内 / 内部 / 外部样式表(附优先级规则)
前端·javascript·css·html·css3
aircrushin14 小时前
端到端AI决策架构如何重塑实时协作体验?
前端·javascript·后端
AI前端老薛14 小时前
前端开发神器 - Image Preview插件
前端
Predestination王瀞潞14 小时前
2.4 编码->W3C XML 1.0标准(W3C Recommendation):XML(Extensible Markup Language)
xml·前端
FlyWIHTSKY14 小时前
vue3中const的使用和定义
前端·javascript·vue.js
小璐资源网15 小时前
如何写出干净、易维护的 HTML 结构
前端·html