Safari无痕浏览影响localStorage

最近项目中遇到一个问题,有一个登录页,点击登录后,公司两个土豪金都不能正常跳转(但是登录请求已经发送到服务器了),其他人的手机都正常。项目又要急着上线,内心这个抓狂啊。。最后静下心来,终于把问题给解决了。

解决过程:

由于服务器有接收到客户端的ajax请求,所以就看客户端是否收到服务器的响应,在回调的success函数下alert(data.code),发现是接收到响应的,并且data.code=0,满足跳转条件,所以在success的else中继续alert,最终将问题定位到 sessionStorage.setItem(‘loginPhone‘,loginPhone);这一句上面,sessionStorage是h5的特性,手机端浏览器一般都支持,通过alert(sessionStorage)、(sessionStorage.setItem)和alert(typeof(sessionStorage.setItem))  发现都正常,typeof(sessionStorage.setItem)得到的是一个function,既然存在sessionStorage,又为什么不能正常执行呢。最后还是通过度娘找到了问题的根源---Safari无痕浏览会影响localStorage。所以只需要将这一句稍作修改即可

 try {
                sessionStorage.setItem("loginPhone",loginPhone);
            } catch (e) {
               alert("您处于无痕浏览,无法为您跳转");
            }

以下是修改之前的代码:

 var loginPhone;

    function submitBindInfo(){
        if( checkSubmitMobile($("#phone-wrap")) &&  checkCode() &&checkContract())
        {
            var param={
                phone:loginPhone,
                authcode:$("#verifycode").val()
            };
            $.ajax({
                type:"POST",
                url:"/portal/member/login.do",
                data:param,
                dataType:"json",
                timeout: 20000,
                error:function(XMLHttpRequest, textStatus, errorThrown){
                    if(XMLHttpRequest.status==408){
                        alert("系统繁忙,请稍后尝试");

                    }else{
                        alert(XMLHttpRequest.status+"错误");
                    }

                },
                success:function(data){
                    doSuccess(data);
                }
            });
        }
    }
    function doSuccess(data){
        if(data.code!=0){
            loginFailCallBack(data.desc);
        }else{

            sessionStorage.setItem(‘loginPhone‘,loginPhone);
            doRedirct();
        }
    }
    function doRedirct(){
        switch (hash){
            case "#member" :
                window.location.href="/portal/member/showMember.do";
                break;
            case "#myOrder" :
                window.location.href="/portal/myorder/showOrder.do";
                break;
            case "#myCoupon" :
                window.location.href="/portal/mycoupon/showCoupon.do";
                break;
            default :
                window.location.href="/portal/sinopec/step0.do";
                break;
        }
    }

  

时间: 2024-08-26 23:04:25

Safari无痕浏览影响localStorage的相关文章

ios中safari无痕浏览模式下,localStorage的支持情况

前言 前阶段,测试提了个bug,在苹果手机中无痕模式下,搜索按钮不好使,无法跳页,同时搜索历史也没有展示(用户搜索历史时使用localStorage存储). 正文 iOS上Sarfari在无痕模式下,浏览器假装支持localStorage,并在全局window上暴漏了该方法,所以校验是有localStorage对象的,但是调用setItem进行保存的时候,就报Error: QuotaExceededError ... : The quota has been exceeded. 因此,进行了个小

localStorage与sessionStorage在safari无痕模式下的情况

localStorage与sessionStorage都是非常好用的h5新特性,当localStorage在iOS Safari.chrome和UC浏览器中的隐私模式(也叫无痕模式)下是无法使用的,会出现如下情况: 这样看来在无痕模式下,localStorage和sessionStorage都是存在的,只是浏览器没有配额存放相关的缓存数据.如果项目不考虑无痕模式的情况,用这二个新特性还是非常好用的,否则还是酌情使用.

不同页面之间的互相影响-localStorage

如果需要因为一个页面的操作而改变另一个页面的内容,可以使用监听localStorage的方式. window.addEventListener("storage", function (e) { alert(e.newValue); }); 另保存json数据到localStorage的方法,先转化字符串 JSON.stringify(obj),取出时在转化为json--JSON.parse(obj): 同一个页面监听变化 var orignalSetItem = localStora

IOS下的safari下localStorage不起作用的问题

我们的一个小应用,使用百度地图API获取到用户的坐标之后用localStorage做了下缓存,测试上线之后有运营同学反馈页面数据拉取不到, 测试的时候没有发现问题,而且2台相同的iphone一台可以一台不行,最后定位到是localStorage有问题. 但是为啥明明版本一样的2台手机一台可以一台不行呢? 而且2台手机打印localStorage明明都是Object,奇怪了. 在度娘上没找到答案,最后到google发现有人说是Private Browsing Mode引起的.然后查看IOS的saf

[开源]jquery-ajax-cache:快速优化页面ajax请求,使用localStorage缓存请求

项目:jquery-ajax-cache 地址:https://github.com/WQTeam/jquery-ajax-cache     最近在项目中用到了本地缓存localStorage做数据的缓存. 1.简单说下localStorage localStorage和cookies相比,在浏览器中存储的容量更大.另外最大的特点是不会附带在http请求中传给后台,不会像cookies一样导致http头部变大影响传输性能.基于这个原因,localStorage适合缓存一些常用的数据,无需平凡的

关于H5本部缓存localStorage,sessionStorage

HTML5 提供了两种在客户端存储数据的新方法: localStorage - 没有时间限制的数据存储 sessionStorage - 针对一个 session 的数据存储 之前,这些都是由 cookie 完成的.但是 cookie 不适合大量数据的存储,因为它们由每个对服务器的请求来传递,这使得 cookie 速度很慢而且效率也不高. 使用方法: localStorage.setItem("menuTitle", arrDisplay); sessionStorage.getIte

sessionStroage localStorage

html5中的Web Storage包括了两种存储方式:sessionStorage和localStorage. sessionStorage用于本地存储一个会话(session)中的数据,这些数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁.因此sessionStorage不是一种持久化的本地存储,仅仅是会话级别的存储. 而localStorage用于持久化的本地存储,除非主动删除数据,否则数据是永远不会过期的. web storage和cookie的区别 Web Stora

iOS 9 更新之Safari广告拦截器(Content Blocker)开发实战

金田( github 源码下载) 相对于谷歌对广告拦截的禁止,苹果与之态度截然相反,继Mac版Safari加入广告拦截工具之后,即将到来的iOS9对Safari也引入了内容拦截插件-Content Blocker,并且开发者可以使用最新的Xcode7开发以及使用iOS 9模拟器进行调试,下面,笔者将用一个简单的实例进行讲解如何开发Content Blocker. 在使用Google搜索时,排行靠前面的几条永远都是广告项,比如搜索“iPhone6”,得到的结果如图1所示: 图1 Google 搜索

HTMl5的sessionStorage和localStorage

html5中的Web Storage包括了两种存储方式:sessionStorage和localStorage. sessionStorage用于本地存储一个会话(session)中的数据,这些数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁.因此sessionStorage不是一种持久化的本地存储,仅仅是会话级别的存储. 而localStorage用于持久化的本地存储,除非主动删除数据,否则数据是永远不会过期的. web storage和cookie的区别 Web Stora