2021-04-26

最新推荐文章于 2022-10-14 10:55:34 发布
最新推荐文章于 2022-10-14 10:55:34 发布
阅读量112 收藏
点赞数
文章标签： vue.js html5 chrome 前端
原文链接：https://www.cnblogs.com/aimmz/p/14704424.html
版权

Chrome更新89版本后，sessionStorage丢失，a标签跳转丢失sessionStorage

目录

Chrome更新89版本后，sessionStorage丢失，a标签跳转丢失sessionStorage

vue项目中遇到的问题，登陆状态toekn保存在sessionStorage，路由跳转，使用router.beforeEach，在页面跳转之前获取token（sessionStorage.getItem(TokenKey)）。

项目中使用的是 router-link（a标签） 打开新标签页，设置了 target="_blank"  tag="a"，发现Chrome更新89版本之后的高版本获取不到 sessionStorage.getItem(TokenKey) 。

点击 router-link 标签时，sessionStorage.getItem(TokenKey) 打印都是null，导致页面会跳转到登陆页。

解决办法如下：

1、最简单的解决办法 - a标签添加属性 rel="opener"

2、a标签换成js方法 - window.open

3、换储存方法 - cookie/localStorage
 

PS：原文借鉴 https://segmentfault.com/a/1190000039662920?utm_source=tag-newest

 

zmm140
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
CBM219X UMPToolV7200(2021-04-26).zip
07-06
CBM219X UMPToolV7200(2021-04-26) 是一个专门针对CBM219X设备的更新工具，它提供了对设备的管理和维护功能，帮助用户进行固件升级、系统优化以及故障排查。这个工具的版本号为V7200，表明它是2021年4月26日发布的，...
Chipsbank APTool量产工具最新版CBM219X-UMPToolV7200(2021-04-26)
04-27
Chipsbank APTool量产工具最新版CBM219X-UMPToolV7200(2021-04-26)
vuex页面刷新数据丢失问题（sessionStorage解决）
黎小小的博客
06-30 1971
vuex中的变量是响应式的，数据存储在内存中，页面手动刷新后数据就丢失了，所以将数据放进sessionStorage(是存储到当前页面关闭为止，和其他tab页没关联)中 另外也可以通过安装插件方式解决（以下三种方式都可以）： 另外通过sessionStorage取出的数据是对象数组[Object,Object]格式，需要存储时通过JSON.stringify(payload)处理数据，取出时通过JSON.parse(sessionStorage.getItem("BANNERS_INFO"))处理
Vue使用sessionStorage实现登录拦截
weixin_43642318的博客
04-26 1374
Vue使用sessionStorage实现登录拦截登录拦截路由拦截sessionStorage和localStorage介绍实现过程1.定义路由2.添加登录拦截3.路由设置4.网页调试查看 登录拦截 登录拦截就是在用户没有登录之前就阻止用户访问那些指定需要登录权限的页面，就只有当用户完成登录后才可以访问这些界面 路由拦截 ​ vue组件化的开发就是使用vue-router进行页面跳转的，所以登录拦截需要处理一下路由，让用户在没有登录成功之前一直处于登录界面。 就算用户在地址栏进行输入地址也会直接返回登
Chrome更新89版本后，sessionStorage丢失a标签跳转丢失sessionStorage
G_ruirui的博客
04-26 1060
localStorage作用范围：本地存储，关闭浏览器后，数据依然会保存。同源浏览器窗口可以共享使用localStorage存储的数据。 sessionStorage作用范围：只存在于当前会话页面，当会话结束后，数据也随之销毁，在不同的浏览器窗口中共享。也就是存在于当前浏览器页面，页面关闭，数据也会删除。（注意：通过鼠标右键打开的新标签无法共享sessionStorage） 而这块对于sessionStorage可能一直存在一个误区，在Chrome浏览器89版本前，当前会话页面指的是当浏览器窗口没有关闭时，
日常遇到的一些问题或知识的笔记（一）
weixin_34179762的博客
12-10 281
1、坑爹的sessionStorage 一直以为sessionStorage、localStorage跟cookie一样，只要存在，整个域名下都可见，直到新开了一个窗口tab页，惊奇的发现下面的sessionStorage丢失了！ Web Storage 包含如下两种机制： sessionStorage 为每一个给定的源（given origin）维持一个独立的存储区域，该存储区域在页面会话期间...
a标签打开新页面sessionStorage丢失
code_game_的博客
04-12 2387
最近突然市场反馈用户登录后点击链接提示重新登录，检查后发现是sessionStorage丢失，原代码是这样的： <a target="_blank" href="www.XXXXX.com" ></a> 首先先说一下seeionStorage: sessionStorage作用范围：只存在于当前会话页面，当会话结束后，数据也随之销毁，在不同的浏览器窗口中共享。也就是存在于当前浏览器页面，页面关闭，数据也会删除。（注意：通过鼠标右键打开的新标签无法共享sessionStorage）
程序员的数学系列书籍介绍-2021-04-26(B).pdf
04-26
程序员的数学系列书籍是一系列为软件开发人员设计的专业数学参考书，旨在帮助程序员深化对数学知识的理解，并将其应用于实际的编程工作之中。这些书籍覆盖了数学领域中的多个重要分支，包括但不限于逻辑和证明、集合...
高质发展，智能制造[2021-04-26]（22页）.pdf
05-21
【智能制造新蓝图与新四化】 智能制造是全球制造业的发展趋势，它涵盖了自动化、信息化、网络化和智能化四大核心能力，这四大能力被统称为"新四化"。新四化不仅代表了智能制造的最新发展路径，也揭示了制造业向高...
vue----sessionStorage保存用户登录数据，解决vuex在页面刷新之后状态丢失问题
coldriversnow的专栏
06-16 1214
需求说明： 在之前写的文章中，vue---将登录成功后后台返回的参数token,id等保存在store中，供其他组件调用存在问题：当页面刷新后，vuex中的数据被初始化，导致vuex的state丢失。那么如何防止页面刷新后state丢失呢? 解决方案： 借助sessionStorage解决上述问题， sessionStorage属性允许在浏览器中存储 key/value 对的数据。 知识点： sessionStorage语法如下： ...
简单实现一个vue路由守卫router.beforeEach通过获取sessionStorage下的token完成登陆跳转此功能，与后端没有交互
qq_66180056的博客
09-30 945
token，sessionStorage，路由守卫，无后端，简单的vue登录
解决Vue刷新后页面数据丢失的问题（sessionStorage和localStorage的用法）
Vivien_CC的博客
10-14 6618
其二，使用sessionStorage可以保证打开页面时sessionStorage的数据为空，而如果是localStorage则会读取上一次打开页面的数据。办法三：在父页面向后台请求远程数据，并且在页面刷新前将vuex的数据先保存至sessionStorage（以防请求数据量过大页面加载时拿不到返回的数据）state - 数据【存项目共享状态，是响应式的，store的数据改变，所有依赖此状态的组件会更新】，相当于全局变量，页面刷新的时候vuex里的数据会重新初始化，导致数据丢失。【页面关闭就没有了】
vue a标签或router-link _blank sessionStorage丢失
qq_24258617的博客
01-05 733
加上属性 rel="opener" j​​​​​​​​​​​​​​a标签或者使用target="_blank"打开新页面，新页面的sessionStorage丢失 - 家有糖果 - 博客园最简单的解决办法 - a标签添加属性 rel="opener" Chrome对于a标签默认添加了noopener属性，所以通过a标签跳转，会丢失新页面的控制权，sessionStohttps://www.cnblogs.com/gyfsweet/p/15070500.html ...
------解决页面刷新时vuex中数据消失-------
weixin_33889245的博客
01-24 556
一、问题描述： 　　我们往往在用vue写项目时，通常会遇到使用vuex请求数据渲染页面后，当再次刷新页面时，渲染页面的数据会消失不见，造成数据部分一片空白这种现象。例如下图。其实这种问题是很好解决的，我来总结一下我的解决方法。 二、解决方法： 　　我在vuex中使用了sessionStorage，我先来介绍一下sessi...
AtCoder Beginner Contest 169 F.Knapsack for All Subsets
旺崽的博客
06-09 2390
AtCoder Beginner Contest 169 F.Knapsack for All Subsets 题目链接 又是魔性 dpdpdp，大佬总是两百行解决，膜了???? 用 dp[i]dp[i]dp[i] 表示结果，对每个 a,i∈[s,0]a,i∈[s,0]a,i∈[s,0]，可以得到状态转移方程： dp[i+a]=dp[i+a]+dp[i]dp[i+a]=dp[i+a]+dp[i]dp[i+a]=dp[i+a]+dp[i] dp[i]=dp[i]∗2dp[i]=dp[i]*2dp[i]=dp
微信浏览器中sessionStorage失效
热门推荐
前端小菜鸟
04-22 1万+
今天在项目中遇到这样一个问题，先大概说下操作流程：微信浏览器中第一个页面填写信息，将信息保存在sessionStorage中，然后第二个页面上传图片，第三个页面回显第一个页面填写的信息并提交。问题是在大部分手机中，这个流程是没有问题的，成功提交；但是在小米手机中，当在第三个页面获取sessionStorage中的信息时，获取到的是null。 查阅了一些资料，有人说移动端浏览器在页面跳转的时候，可...
踩坑记录：360浏览器sessionStorage丢失
smilelixiaojie的博客
04-06 531
qa用360手机浏览器测试时，从A页面跳转到B页面，用js跳转页面语句(window.location.href)方式跳转的，发现在360浏览器丢失了sessionstorage里存储的内容
aptoolv7200(2021-04-26)
最新发布
10-07
这个版本的软件于2021年4月26日发布。 aptool v7200 增加了很多新功能和改进。首先，它提供了更强大的编程接口和工具，使开发人员可以更轻松地创建和调试应用程序。例如，它可能有更好的代码编辑器，语法检查器和...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值