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

这篇具有很好参考价值的文章主要介绍了微信接口wx.login()、wx.request()中获取的内容不能赋值给全局变量(已解决)。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

小程序问题总结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传回内容
                }
              })
}

至此所有问题都已解决文章来源地址https://www.toymoban.com/news/detail-493740.html

抖音/B站/西瓜视频/微信视频号:项目实现计划

作者:冯呵呵与马哈哈

关注获取最新小程序开发知识分享

我们也有对应公众号:象目it

小程序:象目it

到了这里,关于微信接口wx.login()、wx.request()中获取的内容不能赋值给全局变量(已解决)的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 【微信小程序】wx.login实现用户登录

    之前用手机号授权的方式实现登录,现在重新整理成笔记 (1)前端通过wx.login()获取登录凭证code,每次调用的code均不同,有效时间5分钟,每个code可验证一回 (2)前端通过wx.request(我这里是用封装好的request.login)将code发送给后端 (3)后端将appid,appSecret(密钥)和code发送给微信接口

    2024年02月08日
    浏览(41)
  • 企业微信小程序在调用wx.qy.login时返回错误信息qy.login:fail

    原因是大概是绑定了多个企业但是在开发者工具中没有选择正确的企业 解决方法:  重新选择企业后即可成功获取code

    2024年02月13日
    浏览(35)
  • 【需求】微信小程序getAccessToken接口调用过于频繁,导致超过每日限制,不能再次获取

    微信API文档上有讲:①getAccessToken接口生成的access_token的有效期目前为2个小时,需定时刷新,重复获取将导致上次获取的access_token失效②每天有调用次数限制,据说是2000次,具体多少就不知道了。本需求需要保证每天能正常获取和使用getAccessToken。 1.1 联调微信小程序的getA

    2024年02月16日
    浏览(43)
  • 使用小程序的wx.request()请求chatGpt流式接口的实现

    使用小程序的中wx.request()请求chatGpt流式接口的实现 可以成功接收到数据,但是遇到了下面的问题,就是在接收的数据如果是中文会出现乱码,英文没有问题,可以正常解析出来。 大家有遇到这个问题吗,求解,求解…

    2024年02月12日
    浏览(29)
  • 微信小程序封装wx.request请求

    对微信小程序的印象我还停留在2年前刚入行的时候,那是还不懂什么是Promise,只知道小程序发请求有时候要在success回调中嵌套好多层(后来我才知道这叫 回调地狱 )。最近刚好有个小程序的项目交给我发开发,加上如今的我自认为对Promise掌握的还可以,所以这次也尝试着封

    2024年02月16日
    浏览(35)
  • 微信小程序 wx.request 请求封装

    1、添加一些统一的参数或者配置 2、加上默认的请求头和cookie(有就加,没有就为空) 3、将参数,即传入的url地址、请求头传入请求中 4、封装 post 和 get 请求,使代码使用更加方便,以维护

    2024年02月16日
    浏览(29)
  • 微信小程序不能使用wx.getlocation的解决方法

    1、没在小程序开发平台申请开通wx.getlocation API; 2、没有在app.json文件中声明配置; 3、开发版本库较高,调到2.25.3试试; 4、打开微信小程序页面右上角三个点,打开小程序设置,查看是否允许使用位置信息。

    2024年02月11日
    浏览(42)
  • 【微信小程序】使用 wx.request 方法进行异步网络请求

    在微信小程序中,你可以使用 wx.request 方法进行异步网络请求,并将获取到的列表数据渲染到 UI 上。 首先,在页面的 data 中定义一个数组变量,用于存储获取到的列表数据,例如: 然后,在页面的生命周期函数 onLoad 或需要触发网络请求的函数中,使用 wx.request 方法发送异

    2024年02月16日
    浏览(40)
  • 微信小程序 基于Promise 对 wx.request 封装处理

    当我们进行微信小程序开发的时候,会经常涉及到发送网络请求来进行后台数据交互,而在微信小程序中,用来 发送请求的方法是 wx.request() , 但是由于 wx.request() 方法 不支持 Promise 风格的调用,所以导致 wx.request() 用来发送异步请求的时候,会触发成 回调地狱 的表现, 以及

    2024年02月04日
    浏览(34)
  • 微信小程序之网络数据请求 wx:request的简单使用

    出于安全性方面的考虑,小程序官方对 数据接口的请求 做出了两个限制: 只能请求 HTTPS 类型的接口必须将接口的域名添加到信任列表中 . 在自己的微信小程序开发的后台管理中添加相应的服务器域名,配置步骤: 登录微信小程序管理后台 - 开发 - 开发设置 - 服务器域名

    2024年02月16日
    浏览(32)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包