這篇文章主要解決以下問題：使用者每次登入小程式（包括第一次使用）及點選小程式的每個頁面的時候，我們如何判斷他當前的登入狀態是否過期?如果過期，如何重新獲取使用者資訊併發送至開發者伺服器更新使用者資訊，以及設定新的使用者登入狀態？

將這個部分單獨作為一篇文章有兩個原因：

① wx.getUserInfo(OBJECT) 介面調整，廢棄了以前直接獲取使用者資訊的方法；

1. 程式碼邏輯分析

（1）使用者登入態過期時間如何設定？

在上篇文章中也有提到過，使用者登入態可以通過前端設定和後端設定兩種方式進行控制。這裡我們在前端進行控制，即利用wx.checkSession() 介面來判斷session_key 是否過期來作為使用者登入態是否過期的標誌。如果過期了，則跳轉到統一的登入頁面引導使用者點選按鈕重新授權登入

（2）onShow() 與onLoad()

小程式js 中有onShow 與onLoad 兩種事件。兩種事件的區別就在於onLoad 每次開啟小程式只加載一次，跳轉到其他頁面再回來的時候這個事件就不會再觸發。而onShow 則每次進入頁面都會觸發，所以我們在進入每個頁面檢查使用者登入態是否過期的程式碼需要放在onShow 中。

（3）重新登入過程分析

如果使用者登入態過期，則需要進行重新登入。登入過程在上篇文章中也有講過。這裡再簡單梳理一下：前端引導使用者點選按鈕觸發getUserInfo 獲取最新使用者資訊 -> 前端呼叫wx.login() 獲取code -> 前端將code 傳送給後端獲取openid 和seesion_key -> 後端寫session 並返回對應session 的唯一標誌 -> 前端儲存這個唯一標誌。

2. 程式碼例項

• 在每個頁面的onShow 事件中新增以下程式碼來檢查當前使用者登入態是否過期:

wx.checkSession({
  success: function () {
    //session_key 未過期，並且在本生命週期一直有效
    return ;
  },
  fail: function () {
    // session_key 已經失效，需要重新執行登入流程
    wx.navigateTo({
      url: "/pages/authorize/index"
    })
  }
})

• 因為進入每個頁面中都需要進行使用者登入態是否過期的檢查，所以需要有一個公共的授權頁面，當檢查不同過的時候，就跳轉到這個授權頁面引導使用者重新進行授權，授權頁面authorize 程式碼如下：

wxml

<view class="container">
    <view style='width:100%;padding-left:30rpx;font-size: 28rpx;margin-top:30rpx;'>1、同意當前小程式獲取我的微信頭像；</view>
    <view style='width:100%;padding-left:30rpx;font-size: 28rpx;margin-top:30rpx;'>2、同意當前小程式獲取我的微信暱稱等其他資訊；</view>
    <button open-type="getUserInfo" bindgetuserinfo="bindGetUserInfo" class="save-btn">授權登入</button>
</view>

wxss

page{
    height: 100%;
}
.container{
    background-color: #f5f5f9;
    justify-content: initial;
}
.save-btn{
    width: 690rpx;
    height: 80rpx;
    line-height: 80rpx;
    text-align: center;
    margin-top:30rpx; 
    border-radius: 6rpx;
    box-sizing: border-box;
    background-color: #e64340;
    color:#fff;
}

js

// pages/authorize/index.js
var app = getApp();
let Domain = app.globalData.domain;
Page({

  /**
   * 頁面的初始資料
   */
  data: { },

  /**
   * 生命週期函式--監聽頁面載入
   */
  onLoad: function (options) { },

  /**
   * 生命週期函式--監聽頁面初次渲染完成
   */
  onReady: function () { },

  /**
   * 生命週期函式--監聽頁面顯示
   */
  onShow: function () { },

  /**
   * 生命週期函式--監聽頁面隱藏
   */
  onHide: function () { },

  /**
   * 生命週期函式--監聽頁面解除安裝
   */
  onUnload: function () { },

  /**
   * 頁面相關事件處理函式--監聽使用者下拉動作
   */
  onPullDownRefresh: function () { },

  /**
   * 頁面上拉觸底事件的處理函式
   */
  onReachBottom: function () { },

  /**
   * 使用者點選右上角分享
   */
  onShareAppMessage: function () { },
  bindGetUserInfo: function (e) {
    // 獲得最新的使用者資訊
    if (!e.detail.userInfo){
      return;
    }
    wx.setStorageSync('userInfo', e.detail.userInfo)
    this.checkSessionAndLogin();
  },
  /* 
    這裡使用openid 作為與後端session 連線的標誌
    檢查是否存在openid，即之前是否登入過
      如果登入過，檢查session_key 是否過期
        如果過期了，remove openid 重新執行login 並將使用者資訊傳送到伺服器端更新
        如果沒過期則返回
      如果沒登入過則執行login 並將使用者資訊傳送到伺服器更新
  */
  checkSessionAndLogin: function () {
    let that = this;
    let thisOpenId = wx.getStorageSync('openid');

    // 已經進行了登入，檢查登入是否過期
    if (thisOpenId) {
      console.log('have openid')
      wx.checkSession({
        success: function () {
          //session_key 未過期，並且在本生命週期一直有效
          wx.navigateBack({});
        },
        fail: function () {
          console.log('but session_key expired');
          // session_key 已經失效，需要重新執行登入流程
          wx.removeStorageSync('openid');
          that.checkSessionAndLogin();
        }
      })
    } else {
      // 沒有進行登入則先進行登入操作
      console.log('do not have openid');
      that.loginAndGetOpenid();
    }
  },
  // 執行登入操作並獲取使用者openId
  loginAndGetOpenid: function () {
    console.log('do login and get openid');
    let that = this;
    wx.login({
      success: function (res) {
        if (res.code) {
          wx.request({
            url: Domain + '/user/wx_login',
            data: {
              code: res.code
            },
            success: function (res) {
              res = res.data;
              console.log(res)
              // 儲存openId，並將使用者資訊傳送給後端
              if (res.code === 0) {
                wx.showModal({
                  title: 'set openid',
                  content: res.data,
                })
                wx.setStorageSync('openid', res.data);
                that.sendUserInfoToServer();
              } else {
                wx.showModal({
                  title: 'Sorry',
                  content: '使用者登入失敗~',
                })
              }
            }
          })
        }
      }
    })
  },
  sendUserInfoToServer: function () {
    
    console.log('now send user info to server');
    let userInfo = wx.getStorageSync('userInfo');
    let thisOpenId = wx.getStorageSync('openid');

    userInfo.openid =thisOpenId;

    wx.request({
      url: Domain + '/user/updateUser',
      method: 'POST',
      dataType: 'json',
      data: userInfo,
      success: function (res) {
        res = res.data;
        if (res.code === 0) {
          wx.navigateBack({});
        } else {
          wx.showModal({
            title: 'Sorry',
            content: '同步資訊出錯~',
          })
        }
      }
    })
  }
})