移动端浏览器隐私模式/无痕模式使用本地存储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. 内置对象(Session、Application、ViewState)

    内置对象:为了跨页面传值和状态保持.→HTTP的无状态性 [4.]Session:每一台电脑访问服务器,都会是独立的一套session,key值都一样,但是内容都是不一样的 以上所有内容,都跟cook ...

  2. 快速升级php5.6

    !!yum list installed | grep phpcd /etc/yum.repos.drpm -Uvh https://mirror.webtatic.com/yum/el6/lates ...

  3. .c文件如何编译为ko的MAKEFILE文件编写

    首先需要知道: obj-m = *.o obj-y = *.o 上面两者的区别在于,前者才会生成ko文件,后者只是代码编译进内核,并不生成ko文件. 生成KO文件,分两种情况:单个.c文件和多个.c文 ...

  4. centos dns配置

    vi /etc/sysconfig/network-scripts/ifcfg-[tab两下] 新增以下修改 ONBOOT=yes  #开启自动启用网络连接 IPADDR0=192.168.21.12 ...

  5. struts标签,<s:textfield>嵌套<s:property>的问题

    错误:org.apache.jasper.JasperException: /front/orderList.jsp(110,122) equal symbol expected   <s:te ...

  6. std::back_inserter函数用法

    back_inserter函数:配合copy函数,把[a, b)区间的数据插入到string对象的末尾,如果容量不够,动态扩容. 使用案例: 1.客户端与服务器通信场景:服务器向客户端发送数据,客户端 ...

  7. mysql操作--高级

    1.视图 2.储存过程 3.SQL编程

  8. LeetCode(一)

    数据流的中位数 class MedianFinder { private Queue<Integer> maxHeap = new PriorityQueue(new Comparator ...

  9. 問題排查:行動裝置網頁前端 UI 設計 (2)

    之前上網找了個星級評分的範例來玩, 當然這個範例已經用在另一個專案了, 目前看起來沒什麼狀況, 不過在移植到目前的專案之後, 就出現了怪現象: 1. 在大部份時間裡,點擊星星不會有任何反應 2. 即便 ...

  10. 問題排查:建立選單時的錯誤 errcode:65318,errmsg:must use utf-8 charset hint: [Vwda70520vr18]

    目前已知:程式存檔時,將檔案編碼格式設定成 UTF-8 即可. 筆者使用的文字編輯器為 Editplus 3.51,檔案編碼格式很多帶 UTF8.Unicode 字眼的選項,選 UTF-8 即可.