移动端浏览器隐私模式/无痕模式使用本地存储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. html如何绑定radio控件和label控件

    只要指定label的"for"属性到radio的id就行,或者用label标签包围住radio. 第一种方式: <input type="radio" i ...

  2. 说一说inline-block的奇葩之处

    今天本来想聊一下margin和padding,但是当我给div加了一个display:inline-block之后,发现一个问题: .box_demo{border: 1px solid #333;w ...

  3. APP都有哪些类型?

    Web App的优势:(线上应用) 1.开发成本低 2.适配多种移动设备成本低 3.跨平台和终端 4.迭代更新容易 5.无需安装成本 Web App的劣势: 1.浏览的体验短期内还无法超越原生应用 2 ...

  4. js导入外部脚本文件

    JS 语言没找到导入外部脚本文件的功能,只能通知宿主程序来处理. function include(path){ var a=document.createElement("script&q ...

  5. JAVA课程实验报告 实验三 敏捷开发与XP实践

    北京电子科技学院(BESTI) 实     验    报     告 课程:Java程序设计  班级:1353  姓名:韩玉琪  学号:20135317 成绩:             指导教师:娄嘉 ...

  6. (十二) 一起学 Unix 环境高级编程 (APUE) 之 进程间通信(IPC)

    . . . . . 目录 (一) 一起学 Unix 环境高级编程 (APUE) 之 标准IO (二) 一起学 Unix 环境高级编程 (APUE) 之 文件 IO (三) 一起学 Unix 环境高级编 ...

  7. 对div作用域的理解

    若想要div的height起作用,则要保证它上面的层的height也是有用的,如上图

  8. Cable master poj1064(二分)

    http://poj.org/problem?id=1064 题意:共有n段绳子,要求总共被分为k段.问在符合题意的前提下,每段长最大是多少? #include <iostream> #i ...

  9. org.hibernate.MappingException: Unknown entity

    org.hibernate.MappingException: Unknown entity 原因1: 异常是因为使用注解的时候没有导入正确的包.要清楚,Entity包是javax.persisten ...

  10. textfield设置左边距

    CGRect frame = f;//f表示你的textField的frame frame.size.width = ;//设置左边距的大小 UIView *leftview = [[UIView a ...