小程序问题总结01

微信接口wx.login()、wx.request()中获取的内容不能赋值给全局变量（已解决）

在写登录模块的时候，需要使用微信的wx.login()接口获取临时code，并利用临时code向开发者服务器端发送请求，然后获取openid以及session_key。

官方提供的模板：

wx.login({
  success (res) {
    if (res.code) {
      //发起网络请求
      wx.request({
        url: 'https://example.com/onLogin',
        data: {
          code: res.code
        }
      })
    } else {
      console.log('登录失败！' + res.errMsg)
    }
  }
})

我开始的想法: 在onLoad中按照顺序执行两个方法，会先把code赋值给全局变量，然后下面的方法获取code内容，发送request请求获得openid等信息。

出现问题: 我在写代码的时候想要将获取code的代码和后续发送请求获取openid的代码分开，出现了在success中给全局变量code赋值，但是在下面获取时内容为空。

page({
    data:{
        code:'',//临时代码
        ....
    }
.....
.....
//调用两个方法  
onLoad(){
    this.Wxlogin()
    this.getOpenid()
},     
//获取code
Wxlogin(){
    var that = this
    wx.login({
       success (res) {
        this.SetData({
            code:res.code//赋值给this.data.code
        })
      }
    })
},
//获取openid
getOpenid(){
     wx.request({
        url: 'https://example.com/onLogin',
        data: {
          code: this.data.code//获取上面已经赋值的code值，但是此处为空
        },
        success(res){
            console.log(res.data)//控制台输出获取的openid等信息
        } 
      })
}

})

此时出现错误：获取的getOpenid()方法中获取的this.data.code为空。出现这个问题的原因就是在获取this.data.code的时候，获取的是未被赋值的内容。

我的解决方案：

将Wxlogin()设为异步的然后，在调用wx.login()的时候等待它执行结束在。后续再获取code的时候就能获取最新的内容了。

async Wxlogin(){
      var that = this
      var res = await wx.login()
      console.log( res.code)
      if(res.code){
        that.setData({
            code:res.code
        })
      }
}

出现的新问题: 在request中获取到openid以后想要给全局变量赋值，出现了无法赋值的情况。这个时候尝试使用上述async + await的方法并不能解决。

新的解决方案：

在写getOpenid的时候传入一个callback方法参数，用于传回信息。能够解决不能赋值的问题。

onLoad() {
    // 获取openid
    var list=''
    this.Wxlogin()
    this.getOpenId((list)=>{//传入一个自定义方法，list接收返回的信息，方法体内容对信息进行赋值
      this.setData({//赋值
        openid:list.openid,
        session_key:list.session_key
      })
      console.log(this.data.openid)//尝试输出
    })
},
···
···
···
getOpenId(callback){
    var code = this.data.code
      wx.request({
                url: 'http://127.0.0.1:8080/WeChatLogin',
                data:{
                  code
                },
                header: {
                  'content-type': 'application/json' // 默认值
                },
                success(res) {
                  console.log("the value of x is: ")
                  console.log(res.data)
                  callback(res.data)//利用callback传回内容
                }
              })
}