小程序受權登陸

需求:打開頁面,判斷用戶是否登陸,未登陸的話,自定義彈框提醒用戶登陸,已登陸的話,展現用戶信息json

1: wxml 裏面 自定義彈框api

<view class="login" wx:if="{{!hasUserInfoStatus}}" catchtouchmove='true'>
    <view class="mask"></view>
    <view class="d-login-popup">
      <text class='d-login-popup-text'>微信手機號受權</text>
      <image class='d-login-popup-img' src='../../../../assets/images/d_login_img.png'></image>
      <text class='d-login-popup-text'>容許登陸優藍招聘</text>
      <button class='cancel' bindtap='cancelUserinfo'>取消</button>
      <button class='sure' open-type="getUserInfo" bindgetuserinfo="getUserInfo">容許</button>
    </view>
  </view>

2: data 裏面   hasUserInfoStatus 變量 表示是否顯示自定義彈框微信

data: {
    hasUserInfoStatus: true,
}

3: onshow 裏面判斷用戶是否登陸。已登陸,自定義彈框隱藏。未登陸,自定義彈框顯示,用戶經過點擊按鈕,去觸發 受權彈框顯示app

onShow() {
    wx.login({
      success: res => {
        console.log('login', res)
        this.getInfo(res.code);
      }
    });
  }, 
  getInfo: function (code) {
    let _self = this;
    wx.request({
      url: api + '/api/miniProgramController/decodeUserInfo?code=' + code,
      header: {
        'content-type': 'application/json'
      },
      success: function (res) {
        let openid = res.data.openid
        let unionid = res.data.unionid
        _self.setData({
          openId: openid
        })
        app.globalData.openId = openid
        app.globalData.unionId = unionid
        wx.request({
          url: api + '/rest/v1/wxLogin/isLogin/' + openid,
          data: {},
          header: {
            'content-type': 'application/json'
          },
          method: 'POST',
          success: function (suc) {
            if (suc.data.success == true) { // 已登陸
              app.globalData.hasUserInfoStatus = true;
              _self.setData({
                hasUserInfoStatus: true
              })
              if (suc.data.data !== '') {
                app.globalData.ylUserId = suc.data.data
              }
              _self.getComInfo()
            } else { // 未登陸
              app.globalData.hasUserInfoStatus = false;
              _self.setData({
                hasUserInfoStatus: false
              })
              app.globalData.ylUserId = ''
            }
          }
        })
      }
    })
  },

4: 自定義彈框顯示,用戶點擊 容許 按鈕,觸發 getUserInfo 函數, 點擊 取消 按鈕,觸發 cancelUserinfo 函數  函數

getUserInfo: function () { 
    let _self = this;
    wx.getSetting({ // 獲取用戶已經受權的權限
      success(res) {
        console.log(res)
        if (res.authSetting['scope.userInfo']) { // 點擊了 ‘容許’按鈕
          // 已經受權,能夠直接調用 getUserInfo 獲取頭像暱稱
          wx.getUserInfo({
            success: function (res) { }
          })
          wx.navigateTo({
            url: '/pages/newLogin/newLogin?formUser=true' // 跳轉到新頁面
          })
        } else { // 點擊了 ‘拒絕’按鈕
          wx.switchTab({
            url: '/pages/index/index',
          })
        }
      }
    })
  },
  cancelUserinfo(){ 
    wx.switchTab({
      url: '/pages/index/index', // 跳轉到首頁
    })
  },
相關文章
相關標籤/搜索