小程序登录问题--登录函数getUserInfo()写在app.js中,首次加载无法获取后台处理过的用户的信息,刷新一次后就可以获取的解决

遇到这个问题,是因为自己需要写个登录的功能。需要用户自己点击登录后,才登录。

登录的功能函数写在app.js中,现在需要在user.js中使用这个全局的函数,来登录并获取用户信息。但是出现的问题就是,点击登录按钮,虽然能获取到用户信息,但是都是简单的,不是后台处理过的,我们想要的信息。如果退出后重新登录的话,就能获取到用户信息。   也就是说,这个登录的没有同步执行,先获取到用户的简单信息,后异步获取到后台传过来的数据。所以,总会有个滞后的感觉。

下面看下代码:

//app.js


 getUserInfo:function(cb){
    var that = this
    // if(this.globalData.userInfo){
    //   typeof cb == "function" && cb(this.globalData.userInfo)
    // }else{
      //调用登录接口
      wx.login({
        success: function (res) {
          var code = res.code;
          //get wx user simple info
          wx.getUserInfo({
            success: function (res) {
              that.globalData.userInfo = res.userInfo
              // typeof cb == "function" && cb(that.globalData.userInfo);
              //get user sessionKey
              //get sessionKey

              //执行完上面的后,就返回了用户数据。
              //并不是想要的经过处理的用户数据。
              that.getUserSessionKey(code);
            }
          });
        }
      });
    // }
  },

  getUserSessionKey:function(code){
    //用户的订单状态
    var that = this;
    wx.request({
      url: that.d.ceshiUrl + '/Api/Login/getsessionkey',
      method:'post',
      data: {
        code: code
      },
      header: {
        'Content-Type':  'application/x-www-form-urlencoded'
      },
      success: function (res) {
        //--init data        
        var data = res.data;
        if(data.status==0){
          wx.showToast({
            title: data.err,
            duration: 2000
          });
          return false;
        }
        that.globalData.userInfo['sessionId'] = data.session_key;
        that.globalData.userInfo['openid'] = data.openid;
        that.onLoginUser();
      },
      fail:function(e){
        wx.showToast({
          title: '网络异常!err:getsessionkeys',
          duration: 2000
        });
      },
    });
  },
  onLoginUser:function(){
    var that = this;
    var user = that.globalData.userInfo;
    wx.request({
      url: that.d.ceshiUrl + '/Api/Login/authlogin',
      method:'post',
      data: {
        SessionId: user.sessionId,
        gender:user.gender,
        NickName: user.nickName,
        HeadUrl: user.avatarUrl,
        openid:user.openid
      },
      header: {
        'Content-Type':  'application/x-www-form-urlencoded'
      },
      success: function (res) {
        //--init data        
        // console.log(res);
        var data = res.data.arr;
        var status = res.data.status;
        if(status!=1){
          wx.showToast({
            title: res.data.errMsg,//垃圾
            duration: 3000
          });
          return false;
        }
        // console.log(data);
        that.globalData.userInfo['id'] = data.ID;
        that.globalData.userInfo['NickName'] = data.NickName;
        that.globalData.userInfo['HeadUrl'] = data.HeadUrl;
        that.globalData.userInfo['class_sta'] = data.class;
        var userId = data.ID;
        if (!userId){
          wx.showToast({
            title: '登录失败!',
            duration: 3000
          });
          return false;
        }
        that.d.userId = userId;
      },
      fail:function(e){
        wx.showToast({
          title: '网络异常!err:authlogin',
          duration: 2000
        });
      },
    });
  },

下面是user.js中的:

//user.js
这里使用app.getUserInfo()函数,就是app.js中的那个函数
 login:function(){
    var that = this;
    //调用应用实例的方法获取全局数据(app.js)
    
// app.getUserInfo(function (userInfo) {

//   //更新数
//   that.setData({
//     // class_sta: value,
//     class_sta: userInfo.class_sta,
//     userInfo: userInfo,
//     login: true
//   })
//   console.log(app.globalData);
// });
    console.log(app.globalData);
    that.setData({
      class_sta: app.globalData.userInfo.class_sta,
      userInfo: app.globalData.userInfo,
      login: true
  })
  },

就是上面的代码出现了上面说的问题。


后来,经过了好长的时间就这个登录的问题,我差不多话费了一天。就各种调试,百度等等。后来就有了自己的解决办法。但是觉得不太理想,如果大家有好的解决办法。可以留言给我哦。或者访问点击打开链接联系我哦。

上代码:

 getUserInfo:function(cb){
    var that = this
 
      //调用登录接口
      wx.login({
        success: function (res) {
          var code = res.code;
          //get wx user simple info
          wx.getUserInfo({
            success: function (res) {
              that.globalData.userInfo = res.userInfo
             
              //get user sessionKey
              //get sessionKey
              //执行完上面的后,就返回了用户数据。
              //并不是想要的经过处理的用户数据。
              that.getUserSessionKey(code);
            }
          });
        }
      });

  },

  getUserSessionKey:function(code){
    //用户的订单状态
    var that = this;
    wx.request({
      url: that.d.ceshiUrl + '/Api/Login/getsessionkey',
      method:'post',
      data: {
        code: code
      },
      header: {
        'Content-Type':  'application/x-www-form-urlencoded'
      },
      success: function (res) {
        //--init data        
        var data = res.data;
        if(data.status==0){
          wx.showToast({
            title: data.err,
            duration: 2000
          });
          return false;
        }
        that.globalData.userInfo['sessionId'] = data.session_key;
        that.globalData.userInfo['openid'] = data.openid;
        that.onLoginUser();
      },
      fail:function(e){
        wx.showToast({
          title: '网络异常!err:getsessionkeys',
          duration: 2000
        });
      },
    });
  },
  onLoginUser:function(){
    var that = this;
    var user = that.globalData.userInfo;
    wx.request({
      url: that.d.ceshiUrl + '/Api/Login/authlogin',
      method:'post',
      data: {
        SessionId: user.sessionId,
        gender:user.gender,
        NickName: user.nickName,
        HeadUrl: user.avatarUrl,
        openid:user.openid
      },
      header: {
        'Content-Type':  'application/x-www-form-urlencoded'
      },
      success: function (res) {
        //--init data        
        // console.log(res);
        var data = res.data.arr;
        var status = res.data.status;
        if(status!=1){
          wx.showToast({
            title: res.data.errMsg,//垃圾
            duration: 3000
          });
          return false;
        }
        // console.log(data);
        that.globalData.userInfo['id'] = data.ID;
        that.globalData.userInfo['NickName'] = data.NickName;
        that.globalData.userInfo['HeadUrl'] = data.HeadUrl;
        that.globalData.userInfo['class_sta'] = data.class;
        var userId = data.ID;
        if (!userId){
          wx.showToast({
            title: '登录失败!',
            duration: 3000
          });
          return false;
        }
        that.d.userId = userId;
      },
      fail:function(e){
        wx.showToast({
          title: '网络异常!err:authlogin',
          duration: 2000
        });
      },
    });
  },

可以发现就是跟第一代码一样。就是注释的是之前用的出问题的。

user.js  整个代码都拿过来了。需要解释的地方已经有注释了,仔细阅读便可。

var app = getApp()
Page( {
  data: {
    userInfo: {
    },
    orderInfo:{},
    class_sta:'',
    loadingText: '加载中...',
    login:false,
    loadingHidden: false,
  },


  //下拉刷新
  onPullDownRefresh: function () {
    wx.showNavigationBarLoading() //在标题栏中显示加载
    //模拟加载
    var that = this;
    setTimeout(function () {
      // complete
      wx.hideNavigationBarLoading() //完成停止加载
      wx.stopPullDownRefresh() //停止下拉刷新
    }, 1500);
  },


  //生命周期函数--监听页面加载
  onLoad: function (option) {
      var that = this
      //这里为了防止异步操作,先加载了APPgetuserInfo函数。因为首次使用该函数,返回的是没有处理过的数据,不是想要的。需要再次使用方可。
      app.getUserInfo();
  },
  onLaunch:function(){
    var that = this
  },
  call_phone:function(){
    wx.makePhoneCall({
      phoneNumber: '13213767383',
      success:function(res){
        
      }
    })
  },
  logout:function(){
    var that= this;
    wx.showModal({
      title: '确定退出吗?',
      content: '',
      success:function(res){
        if(res.confirm){
        //清除数据
          that.setData({
            userInfo: {},
            login: false,
            class_sta:''
          })
          //退出登录后,清除全局变量里的内容
          app.getUserInfo();
        }
      }
    })
    
  },
  login:function(){
    var that = this;
    //调用应用实例的方法获取全局数据(app.js)
    
// app.getUserInfo(function (userInfo) {
//   //更新数
//   that.setData({
//     // class_sta: value,
//     class_sta: userInfo.class_sta,
//     userInfo: userInfo,
//     login: true
//   })
//   console.log(app.globalData);
// });
    console.log(app.globalData);
    that.setData({
      class_sta: app.globalData.userInfo.class_sta,
      userInfo: app.globalData.userInfo,
      login: true
  })
  },

  
  onShareAppMessage: function () {
    return {
      title: '点餐小小',
      path: '/pages/index/index',
      success: function (res) {
        // 分享成功
      },
      fail: function (res) {
        // 分享失败
      }
    }
  }
})


如果大家有其他更好的解法,欢迎留言呐

你可能感兴趣的:(微信小程序)