移动端浏览器隐私模式/无痕模式使用本地存储localStorage/sessionStorage的问题

开发H5 webapp时经常需要使用本地存储,如localStorage和sessionStorage存储一些数据,相比最多能存4k的cookie相比,用起来很好用。但是localStorage在iOS Safari、chrome和UC浏览器中的隐私模式(也叫无痕模式)下无法使用,手机Safari浏览器中具体表现是:

  • localStorage对象仍然存在
  • 但是setItem会报异常:QuotaExceededError
  • getItem和removeItem直接忽略

Safari中控制台截图

判断浏览器是否支持localStorage的方法:

function isLocalStorageSupported() {
var testKey = 'test',
storage = window.sessionStorage;
try {
storage.setItem(testKey, 'testValue');
storage.removeItem(testKey);
return true;
} catch (error) {
return false;
}
}

移动端浏览器隐私模式/无痕模式使用本地存储localStorage/sessionStorage的问题的更多相关文章

  1. Web端本地存储

    1.需求背景:当用户在页面上添加一行一行的数据时,突然发现网络断掉了,页面上编辑的数据没法保存进数据库,所以需要一个本地端的临时保存功能,以便在网络通畅后重新加载出来! 2.解决方案: 结合网上搜刮, ...

  2. Chrome 浏览器的简单设置 无痕模式 暗黑模式 自定义用户目录

    1. Chrome73 新增加了暗黑模式 可以通过修改快捷方式的方式来默认开启方法如下 1.1 关闭浏览器 2.2 鼠标焦点定位到任务栏 Chrome 图标处, 并且按住shift 按键 执行右键操作 ...

  3. 在IOS手机safari浏览器的无痕模式下,localStorage不起作用

    无痕模式是黑色风格,正常模式是白色风格.在无痕模式中,使用localStorage.setItem()会报错,但在window对象下确实有localStorage.setItem方法. if (typ ...

  4. Safari无痕模式下,storage被禁用问题

    前言 Safari开启无痕模式后,localStorage和sessionStorage为空,对其进行set操作也会报错,也就是说这种情况下,storage是被禁止使用了.接下来说一下解决方法. 解决 ...

  5. Safari无痕模式是不能只使用localStorage存储数据要用Cookie做补丁

    safari 无痕浏览情况测试(部分手机)   1.测试机型 iPhone7 Plus  版本 11.3 iPhone6 Plus  版本 11.3.1 iPhone6    版本 10.2.1 iP ...

  6. ios的坑 无痕模式

    我们的一个小应用,用localStorage做了下缓存,测试上线之后有反馈页面数据拉取不到, 最后定位到是localStorage有问题. 是Private Browsing Mode引起的.然后查看 ...

  7. 对端边缘云网络计算模式:透明计算、移动边缘计算、雾计算和Cloudlet

    对端边缘云网络计算模式:透明计算.移动边缘计算.雾计算和Cloudlet 概要 将数据发送到云端进行分析是过去几十年的一个突出趋势,推动了云计算成为主流计算范式.然而,物联网时代设备数量和数据流量的急 ...

  8. 设置浏览器使用的dom模式为IE7

    <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7"/>设置浏览器使用的dom模式为 ...

  9. DOCTYPE与浏览器模式详解(标准模式&混杂模式)

    关于渲染模式: 在多年以前(IE6诞生以前),各浏览器都处于各自比较封闭的发展中(基本没有兼容性可谈).随着WEB的发展,兼容性问题的解决越来 越显得迫切,随即,各浏览器厂商发布了按照标准模式(遵循各 ...

随机推荐

  1. MySql生日闰月处理

    1. 科普下润年: ①.非整百年能被4整除的为闰年.(如2004年就是闰年,2100年不是闰年) ②.整百年能被400整除的是闰年.(如2000年是闰年,1900年不是闰年)   2. 例: 例如:当 ...

  2. scala学习心得(2)

    scala类中可以通过override 重载方法 scala定义的函数式类不可被改变,这样传进去的参数就需要提前被检验,可以通过scala.predef包中的方法require方法 定义辅助构造器 d ...

  3. UNIX环境高级编程--10. 信号

    第十章        信号    信号是软中断,提供了一种处理异步事件的方法.例如,终端用户键入终端键,会通过信号机制停止一个进程,或及早终止管道中的下一个程序.    每个信号都有一个名字,SIG开 ...

  4. Quartus 的管脚分配

    与管脚分配相关的一些功能在assignments菜单下, Remove assignments... Back-Annotate Assignment... Import Assignment... ...

  5. JAVA定义接口格式:

    [public]interface 接口名称 [extends父接口名列表] { //静态常量 [public] [static] [final] 数据类型变量名=常量值; //抽象方法 [publi ...

  6. 开源PLM软件Aras详解二 汉化以及界面

    Aras安装完毕之后,默认语言为英语,对于国内很多制造业并不适用,那么下面就来说说如何汉化 首先下载汉化包:zh-cn_languagepack-110v3.zip 步骤如下: 步骤1- 设定安装程序 ...

  7. HashTable、HashSet和Dictionary的区别

    今天又去面试了,结果依然很悲催,平时太过于关注表面上的东西,有些实质却不太清楚,遇到HashTable和Dictionary相关的知识,记录下来,希望对后来人有所帮助,以及对自己以后复习可以参考. 1 ...

  8. 使用spring 4.0 + maven 构建超简单的web项目

    一.需求 使用spring去管理web项目,是目前非常流行的一种思路,本文将介绍使用maven+spring 4.0.2 来构建一个简单的web项目. 二.实现 1.新建一个maven项目,如下图所示 ...

  9. URLEncoder编码

    客户端在进行网页请求的时候,网址中可能会包含非ASCII码形式的内容,比如中文. 而直接把中文放到网址中请求是不允许的,所以需要用URLEncoder编码地址, 将网址中的非ASCII码内容转换成可以 ...

  10. android开发环境搭建(64位)

    一.相关下载 1.下载JDK.  网址:http://java.sun.com/javase/downloads/index.jsp,选择jdk-7u21-windows-x64.exe. 2.下载E ...