大龄业余程序员要搞个django小程序--09--小程序登陆状态维护之个人中心如何做数据加载

Posted 2021-10-16 锅大虾

在此之前，先明确：
1、小程序初次载入时检查sessionKey和缓存中是否有userInfo，两个都满足时，将全局变量isLoginGlobal: bool 标记未true

2、小程序的登陆状态依靠全局变量isLoginGlobal: bool 来确认登陆与否

3、其他页面加载时，要优先将isLoginGlobal写入载入data，为true时，再加载缓存中的uesrInfo

4、能加载到userInfo时（确保万无一失，加载某个页面时，再尝试读取一下userInfo的缓存），能加载进来则确认登陆状态，反之则不登陆。

附上代码：

app.js

App({
  onLaunch() {
    // 检查用户的登陆状态
    this.checkLoginStatus()
  },
  checkLoginStatus() {
    // 当sessionKey和userInfo同时存在时才能设置为登陆状态
    let u = wx.getStorageSync('userInfo')
    let s = checkSessionLogin()
    s.then((res) => {
      if (u) {
        console.log('设置为登陆状态');
        this.globalData.isLoginGlobal = true;
      } else {
        console.log('需要重新登陆');
        this.globalData.isLoginGlobal = false;
      }
    }).catch(err => {
      console.log('需要重新登陆');
      this.globalData.isLoginGlobal = false;
    })
  },
  globalData: {
    // 全局设置，用来设置小程序的登陆状态，依赖sessionKey和userInfo
    isLoginGlobal: false,
  }
})

/*
* 1、使用wx.checkSession检查微信服务端的sessionKey是否过期 -> 过期则使用wx.login发请求，反之则保持小*    程序的登陆状态
* 2、使用wx.login发起请求
*/

export const checkSessionLogin = () => {
  return new Promise((resolve, reject) => {
    wx.checkSession({
      success: (res) => {
        resolve(res)
      },
      fail: (err) => {
        reject(err)
      },
      complete: (res) => {},
    })
  })
}

---

这样判断来判断去，还使用全局变量来维护登陆状态会不会很麻烦，其实我也不清楚，不过感觉这样很稳妥，容错率高。

个人中心如何加载数据

截图中，显性的数据有

• 登陆
• 我的积分、浏览历史、我的收藏
• 年会会员(成为会员时则显示会员到期时间)

以上几个数据都是显性的，即登陆后就要立刻显示的。那么这个页面数据的加载应这样设计。

一、登陆状态的判断

• 获取全局变量isLoginGlobal，为true时，继续读取本地缓存userInfo
• 能读取到userInfo时，将isLogin = true设置到本页面data中，正式标记已登陆
• 反之，isLoginGlobal 为false或获取不到userInfo的缓存，设置isLogin = false，标记为未登陆

二、未登陆时，不会展示任何数据，点击登陆后

• 存储token到缓存中
• 存储userInfo到缓存中
• 标记isLoginGlobal = true 、标记本页data: isLogin = true
• 将显性数据写到data中

三、如已登陆

在步骤一中，如果标记为登陆，那么应及时向开发者服务器发起请求，接收显性的数据并予以展示，通俗地说，都登陆了，最起码显性的数据得给人家看吧？？

总结

• 依靠全局数据进行状态的标记，有利于各个页面的对全局数据的使用，也方便维护
• 不管哪个页面，加载时都需要获取全局中的状态，已确认当前是应该登陆还是未登陆
• 用户数据userInfo是个关键点，因为登陆了你至少得让用户看到个人信息吧，所以这也是维持登陆状态的点之一。