当前位置: 首页 > 工具软件 > AppJS > 使用案例 >

小程序promise等待app.js登录成功再请求

裴嘉良
2023-12-01

小程序的登录api和交互后台完成登录是一个异步的过程,但是有些页面的后台接口必须要用户id,这种情况只能等待app.js里面的登录完成,才能执行下一步请求。我们采用ES6的promise方法来实现。

1、app.js

App({
  onLaunch: function () {
    
  },
  globalData: {
    userInfo: null
  },
  userLogin: function () {
    let that = this;
    let promise = new Promise((resolve, reject) => {
      wx.login({
        success: res => {
          wx.request({
            url: '后台服务器地址',
            data: { code: res.code },
            method: method,
            header: { 'Content-Type': 'application/x-www-form-urlencoded' },
            success: res => {
              that.globalData.userInfo = res.data.userInfo
              resolve(res);
            },
            fail: err => {
              reject(err)
            }
          })
        }
      })
    })
    return promise;
  }
})

2、pages/index/index

const app = getApp()
Page({
  data: {
    
  },
  onLoad: function () {
    app.userLogin().then((res) => {
      console.log('在app.js登录后面才执行');
      console.log('登录用户数据' + res);
    }, (error) => {
      console.log('登录失败:' + error)
    })
  }
}

3、以上写法有一个缺点,进页面前应该先判断一下本地有没有可用的用户信息,否则每次进入需要用户信息的页面,都要登录一次

const app = getApp()
Page({
  data: {
    
  },
  onLoad: function () {
    // 先判断是否存在用户信息
    if(!app.globalData.userInfo){
      // 没有用户信息,先获取用户信息
      app.userLogin().then((res) => {
        console.log('在app.js登录后面才执行');
        console.log('登录用户数据' + res);
      }, (error) => {
        console.log('登录失败:' + error)
      })
    } else {
      //有用户信息,直接执行下面的数据请求
      // ....
    }
  }
}

 

 类似资料: