小程序异步登录解决方案

wx.login()

小程序上面获取openid必须通过前端wx.login()方法来获取code,后台通过前端传递过来的code向微信请求以获取openid、session_key等关键信息,后端也可以通过code来进行用户登录业务开发,

wx.login()异步请求

在平常的登录开发中,一般都是把登录封装到app.js中的onLaunch中(登录开发方式不唯一),用户每次冷打开都会进行用户登录,在登录之后我们也会进行一些业务的开发和数据请求,如果按照事件执行顺序,小程序在初始化时触发app.js里的onLaunch方法之后,才应该执行Pages文件下的onLoad方法,但是wx.login()获取code请求的时候是异步数据请求,所以在请求wx.login()方法还未结束的时候,Pages文件下的onLoad就已经执行了,这个异步所带来的后果就是第一次数据请求,Pages文件下的onLoad下面的执行速度会一直大于app.js里的onLaunch执行速度。

暂行解决办法

既然已经知道执行的先后顺序是因为异步请求的结果,那么可以通过ES6中提供的Promise方法来进行处理,听过回调函数来进行其他页面的请求。
code
目录为根目录下的-app.js

  userLogin:function(){
    let that = this;
    let promise = new Promise((resolve, reject)=>{
      wx.login({
        success: function (res) {
          wx.request({
            url: '服务器地址',
            dataType: "json",
            data: '要传递的参数code',
            method: method,
            header: {'Content-Type': 'application/x-www-form-urlencoded'},
            success: function (res) {
              resolve(res);
            },
          })
        },
        fail(error) {
          reject(error)
        }
      })
    })
    return promise;
  },

pages>index.js>onLoad

const app = getApp()
app.userLogin().then((res)=>{
    //数据请求成功之后的操作
    //可以请求其他的数据了
},(error)=>{
    console.log('数据请求失败:'+error)
})
评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值