安卓系统，启用微信浮窗 session 丢失

50 阅读 0 评论 33 点赞

我是靠谱客的博主清秀灯泡，最近开发中收集的这篇文章主要介绍安卓系统，启用微信浮窗 session 丢失，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

在安卓系统上，启用微信浮窗后打开浮窗页面时会导致sessionStorage丢失，ios是不存在这个问题的。
有接口的入参是存在session中的，解决这个问题，
1要么跳转到首页（登录页不太人性，有些牌子的安卓机不支持存账号密码的），
2要么使用local，
3要么把参数挂在query中，不过有些敏感参数容易造成安全隐患。
一开始直接使用的session也懒得进行大改动，跟产品商量了一下，跳转到首页。

·main.js·
router.beforeEach((to, from, next) => {
  if(!sessionStorage.getItem('uid') && (to.path != '/index' && to.path !='/login')){//微信浮窗
    console.log('从微信浮窗进入非首页，没有uid:',!sessionStorage.getItem('uid'),'不是首页/登录页:',to.path != '/index'' && to.path !='/login',to.path);
    next({
      path:'/index',
      query:{
        type:localStorage.getItem('type'),
        uid:localStorage.getItem('uid'),
      }
    });
  }else{
    sessionStorage.getItem('uid')?
    console.log('正常跳转',to.path):
    console.log('首次进入或者从微信浮窗进入首页/登录页，没有uid:',!sessionStorage.getItem('uid'),'不是首页/登录页:',to.path != '/index' && to.path !='/login',to.path);
    if (to.meta.title) { //动态切换页面title，如果路由中有定义的mate.title就使用meta.title
      window.document.title = to.meta.title
    }else{ //如果路由中没有定义title就使用页面动态定义的title
      Vue.directive('title', {
        inserted: function (el, binding) {
          document.title = el.dataset.title
        }
      })
    }
    next();
  }
})

·login·
登录以后，原先是只储存了session就跳转到首页，现在需要把再存local一份
sessionStorage.setItem('type',this.type);
sessionStorage.setItem('uid',this.uid);
localStorage.setItem('type',this.type);
localStorage.setItem('uid',this.uid);