小程序之登录验证界面的实现

首先得写一个登录验证的界面 具体可参考以下链接
https://blog.csdn.net/weidong_y/article/details/79636386
然后在app.json中写上

  onLaunch: function() {

    // 展示本地存储能力
    var logs = wx.getStorageSync('logs') || []
    logs.unshift(Date.now())
    wx.setStorageSync('logs', logs)
    const that = this
    // 登录
    wx.login({
      success: res => {
        const code= res.code
        // 发送 res.code 到后台换取 openId, sessionKey, unionId`
        wx.getSetting({
          success: res => {
            if (res.authSetting['scope.userInfo']) {
              // 已经授权，可以直接调用 getUserInfo 获取头像昵称，不会弹框
              wx.getUserInfo({
                success: res => {
                  // 可以将 res 发送给后台解码出 unionId
                  console.log(res)
                  this.globalData.userInfo = res.userInfo
                  console.log(this.globalData.urls)
                  wx.request({
                    url: this.globalData.urls + "/api/login/get_openid",
                    method: "POST",
                    header: {
                      "content-type": "application/x-www-form-urlencoded",
                      'content-type': 'application/json' // 默认值
                    },
                    data: {
                      code: code,
                      nickname: this.globalData.userInfo.nickName,
                      gender: this.globalData.userInfo.gender,
                      avatarUrl: this.globalData.userInfo.avatarUrl
                    },
                    success: res => {
                      console.log(res)
                      //  that.globalData.openid = res.data.openid
                      console.log(this.globalData.userInfo.nickName)
                    }
                  })

                  // 由于 getUserInfo 是网络请求，可能会在 Page.onLoad 之后才返回
                  // 所以此处加入 callback 以防止这种情况
                  if (this.userInfoReadyCallback) {
                    this.userInfoReadyCallback(res)
                  }
                }
              })
            }
          }
        })      
      }
    })
    
  },

注意 箭头函数的使用 因为如果不用箭头函数里面的this指向能把你绕崩了 使用箭头函数的好处是箭头函数没有自己的this 只能继承它外面那一层的this指向

想要实现登录验证 一般情况下 打开小程序时默认的页面为首页 如果没有验证过 则跳到验证页面 在验证页面点击允许后在跳回首页 验证的方法是在登录页面的onLoade函数中设置getstroge 在验证页面设置 setstorge