关于sessionStorage的移动端兼容问题
最近在开发移动端项目时，需要用到的本地存储的地方不少。都是一些只要记住当前打开窗口的用户数据就行，所以我选择用的sessionStorage。
使用场景如下：
A.html页面需要记录一条数据{a:1,b:2};
sessionStorage.setItem("data","{a:1,b:2}");
B.html页面取出使用;
sessionStorage.getItem("data"); // 获取结果为null
问题：
如果项目不是单页面复应用，AB是两个html文件，需要跳转href的。我们会发现有些Andiron系统的浏览器在B页获取是到的结果是null (如：vivo手机自带的世界之窗浏览器)。
原因：
经过分析，其实这并不是这个浏览器不支持sessionStorage，因为你还是能获取到sessionStorage这个对象的。
而是因为sessionStorage是一个当前窗口的数据存储格式，有些浏览器在跳转新页面的时候他系统是打开了一个新的webView，把原来的关了,也就相当于我们在浏览器打开了一个新窗口。
这样他就跟我们的sessionStorage原理冲突了，在新页面当然就获取不到咯。
所以建议大家做移动端的时候如果不是单页面复应用的的项目最好不要使用sessionStorage。慎用！
解决办法：(2019年了，哈哈！！ 来补充下解决办法，有用的话支持下我哦^_^ ^_^ ^_^，下面的广告也是今天补的，不关注我的广告，给我点个赞也非常谢谢的！^_^)
利用localStorage，和window.name来实现：
window.name属性：页面刷新是不会被重置的
A.html页面
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script>
//这清除一定要在页头,如果是新进入的页面就清除上次传存储的值
if(window.name === ''){
localStorage.removeItem("aUser");
window.name = 'isReload';
} </script>
</head>
<body>
<script>
//设置值
localStorage.setItem("aUser","aaa");
</script>
</body>
</html>
B页面
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script>
//这清除一定要在页头,如果是新进入的页面就清除上次传存储的值
if(window.name === ''){
localStorage.removeItem("bUser");
window.name = 'isReload';
}
//判断如果A页面有存储，那就取出来过渡到B页面来
let a = localStorage.getItem('aUser');
if(a){
localStorage.setItem('bUser',a);
} </script>
</head>
<body>
<script>
//获取值
localStorage.getItem("bUser"); //aaa
</script>
</body>
</html>
关于sessionStorage的移动端兼容问题的更多相关文章
- 【移动端兼容问题研究】javascript事件机制详解（涉及移动兼容）
前言 这篇博客有点长,如果你是高手请您读一读,能对其中的一些误点提出来,以免我误人子弟,并且帮助我提高 如果你是javascript菜鸟,建议您好好读一读,真的理解下来会有不一样的收获 在下才疏学浅, ...
- ReactJs移动端兼容问题汇总
汽车H5使用ReactJs问题汇总 Q:安卓4.4webview显示空白? A:初步怀疑是css属性没有加前缀引发的兼容问题,但添加后发现也不行,通过webview调试后控制台输出Set is und ...
- 网页背景H5视频自动播放---PC端、移动端兼容问题完美解决方案（IOS、安卓、微信端）
最近公司官网需要使用视频当做banner背景且自动播放,并且因为是官网需要做到PC端和移动端都可以适配兼容,这些问题很是头疼: 兵来将挡,水来土掩,进过查阅相关技术资料,现已完美兼容PC端和移动端.下 ...
- vue e.path 移动端兼容
作用 e.path 用来获取点击元素及以上所有父元素的一个数组 问题 当在移动端会有获取不到e.path的问题 不兼容 解决 let path = event.path || (event.compo ...
- 移动端—— 兼容PC端，移动端的点击事件
移动设备上不支持鼠标事件,好在webkit内核的移动浏览器支持 touch 事件,所以触摸事件是移动应用中所必须的.touchstart.touchmove.touchend事件可以类比于moused ...
- 年度账单h5 移动端兼容问题以及优化建议(vue)
定时器 vue实例中定义timer多余,创建的定时器代码和销毁定时器的代码没有放在一起,通常很容易忘记去清理这个定时器,不容易维护:建议使用this.$once('hook:beforeDestory ...
- vue--移动端兼容问题
click的300ms延迟: 引入fastclick库来解决 输入命令 npm install fastclick 在main.js导入 import Vue from 'vue' import Ap ...
- 移动端兼容 - faskclick.js
fasckclick为解决移动端300ms延迟而生 github地址为:https://github.com/ftlabs/fastclick 使用方法: 1. 原生使用(window.onload或 ...
- pc端兼容IE9及以上版本
最近业务部门反映我们商城的兼容性不是很好,尤其是在IE浏览器上,经过调研,我们决定对IE9及以上版本的IE内核浏览器进行主流程测试,发现有哪些功能在IE9上不兼容 一.CSS兼容性 如下图所示 使用了 ...
随机推荐
- Dojo初探之2:设置dojoConfig详解，dojoConfig参数详解+Dojo中预置自定义AMD模块的四种方式（基于dojo1.11.2）
Dojo中想要加载自定义的AMD模块,需要先设置好这个模块对应的路径,模块的路径就是这个模块的唯一标识符. 一.dojoConfig参数设置详解 var dojoConfig = { baseUrl: ...
- C语言和go语言之间的交互
一.go代码中使用C代码 go代码中使用C代码,在go语言的函数块中,以注释的方式写入C代码,然后紧跟import "C" 即可在go代码中使用C函数 代码示例: go代码:tes ...
- JVM高级特性-三、垃圾收集之判断对象存活算法
一.概述 运行时数据区中,程序计数器.虚拟机栈.本地方法栈都是随线程而生随线程而灭的 因此,他们的内存分配和回收是确定的,在方法或线程结束时就回收.而Java堆和方 法区则是不确定的,程序运行过程中创 ...
- Ubuntu下录音机程序的使用
在Ubuntu中使用系统自带的录音机程序可以录制电脑的音频输出(比如,电脑正在播放视频的声音),或录制外部环境音频输入(比如,自己说话的声音) 1.录制电脑音频输出 在“硬件”选项中,将”选中设备的设 ...
- Nmap脚本文件分析（AMQP协议为例）
Nmap脚本文件分析(AMQP协议为例) 一.介绍 上两篇文章 Nmap脚本引擎原理 编写自己的Nmap(NSE)脚本,分析了Nmap脚本引擎的执行过程,以及脚本文件的编写,这篇文章将以解析AMQ ...
- Java代码实现 增删查 + 分页——实习第四天
今天项目内容已经开始了,并且已经完成好多基本操作,今天就开始总结今天学习到的内容,和我遇到的问题,以及分析这其中的原因. 内容模块: 1:Java代码实现对数据库的增删查: 2:分页且获取页面信息: ...
- angular之$watch、$watchGroup、$watchCollection
1,原型:$watch: function(watchExp, listener, objectEquality, prettyPrintExpression){}: 2,参数:watchExp(必须 ...
- 【CC2530入门教程-04】CC2530的定时/计数器原理与应用
第4课 CC2530的定时/计数器原理与应用 广东职业技术学院 欧浩源 一.定时/技术器的基本原理 定时/计数器,是一种能够对内部时钟信号或外部输入信号进行计数,当计数值达到设定要求时,向CPU提 ...
- 安装gcc提示no acceptable C compiler found in $PATH
安装gcc提示no acceptable C compiler found in $PATH 从所报错可以看出是缺少了c编译器,因为gcc就是c编译器,所以没有安装gcc就没有c编译器. 之所以报这样 ...
- JS延时一秒执行
//JS延时一秒执行 setTimeout(function(){ window.history.go(0); }, 1000);