#推荐

解决微信小程序web-view嵌套H5时使用setStorageSync,localStorage.setItem有时候失效的问题

问题描述

1. 我用uniapp写的一个H5，嵌套在微信小程序web-view中，但是用户反应，登录过后，老是出现需要登录的情况，安卓手机普遍出现，ios情况较少，导致用户体验很差，业务模式很难继续进行下去。
2. 原因？未知，社区找了很多资料，官方也没有给出具体的解决方案。
3. 之前的写法：登录成功之后，将用户信息存储在localStorage中：

   if(res.msg == '登录成功'){
       uni.setStorageSync('username', res.username);
       uni.setStorageSync('token', res.token);
       localStorage.setItem("username2",res.username);    
       localStorage.setItem("token2",res.token);
   }
   
   

   4. 解决方案的写法，将用户信息用cookie进行存储：

   if(res.msg == '登录成功'){
       uni.setStorageSync('username', res.username);
       uni.setStorageSync('token', res.token);
       localStorage.setItem("username2",res.username);    
       localStorage.setItem("token2",res.token);
       document.cookie="username="+ res.username;
       document.cookie="token="+ res.token;
   }
   

   获取cookie，我写在了全局js文件中了:

   //获取cookie
   Vue.prototype.getCookie = function(objName){
       var arrStr = document.cookie.split("; ");
       for (var i = 0; i < arrStr.length; i++) {
   	var temp = arrStr[i].split("=");
   	if (temp[0] == objName){
   	    return decodeURI(temp[1]);
   	}
       }	
   }
   
   

   调用：

   data() {
       return {
   	username:this.getCookie('username') || uni.getStorageSync('username') || localStorage.getItem('username2')
       }
   }
   
   

   神奇的是，你会发现完美解决上述问题，用户反应也不会出现重新登录的情况了。OVER，又填了一个小程序的坑~