Uni-App之登陆状态保持

简介

uni-app 中不支持读写 cookie，所以不能如传统的应用那样通过读取 cookie 来判断是否是登录状态。

流程

1. 未登录状态
2. 进行登录(后台验证账号密码通过，返回该账号用户名等信息)
3. 状态改变(将返回的账号信息保存到本地)

• 为了个页面共享账号信息，需要使用Vuex

const store = new Vuex.Store({  
    state: {  
        uerInfo: {},  
        hasLogin: false  
    },  
    mutations: {  
        login(state, provider) {//改变登录状态  
            state.hasLogin = true  
            //state.uerInfo.token = provider.token
            state.uerInfo.userName = provider.user_name  
            uni.setStorage({//将用户信息保存在本地  
                key: 'uerInfo',  
                data: provider  
            })  
        },  

        //退出登录    务必清除登录状态 以及 本地用户信息，防止下次打开app重现、以及出现不正确状态
        logout(state) {
            state.hasLogin = false  
            state.uerInfo = {}  
            uni.removeStorage({  
                key: 'uerInfo'  
            })  
        }  
    }  
})  

4. 退出应用再次进入仍然是已登录状态

• 在 App.vue 中判断用户是否保存用户信息 "uerInfo"，如果保存则认为是登录状态，未保存则为未登录状态。

onLaunch: function () {  
           uni.getStorage({//获得保存在本地的用户信息  
               key: 'uerInfo',  
               success:(res) => {

                   //获取成功即说明本地有保存用户数据，把res.data继续给state.userInfo。并修改登录状态，由此达到登录状态


                   //this.login(res.data);  
                   //uni.request({// 再次校验并刷新token的有效时间  
                       //url: `${this.$serverUrl}/auth.php`,  
                       //header: {  
                       //   "Content-Type": "application/x-www-form-urlencoded",  
                       //    "Token":res.data.token  
                       //},  
                       //data: {  
                       //    "username":res.data.user_name  
                       //},  
                       //method: "POST",  
                       //success: (e) => {  
                       //    if (e.statusCode === 200 && e.data.code === 0) {  
                       //       this.login(e.data);  
                       //   }  
                       //}  
                   //})  
               }  
           });  
       },  

此为简化版，重在讲述业务逻辑，实际开发中登录需要严格验证，
返回的用户信信息也会多种多样。