微信小程序> 微信无响应,微信小程序开发点击按钮获取用户授权没反应或反应很慢的解决方法

微信无响应,微信小程序开发点击按钮获取用户授权没反应或反应很慢的解决方法

浏览量:3531 时间: 来源:weixin_30455067
异常描述:
点击按钮获取用户手机号码,有的时候会出现点击无反应或很久之后才弹出用户授权获取手机号码的弹窗,这种情况下,也会出现点击穿透的问题(详见:微信小程序开发——连续快速点击按钮调用小程序api返回后仍然自动重新调用的异常处理)
异常解析:
1.getPhoneNumber的使用:
对于getPhoneNumber(OBJECT)API,由于小程序需要用户主动触发才能发起获取手机号接口,所以该功能不由API来调用,需用button组件的点击来触发(具体使用方法详见getPhoneNumber(OBJECT))。
1buttonopen-type="getPhoneNumber"bindgetphonenumber="getPhoneNumber"/button对于使用方法,官方文档是这么说的:
需要将button组件open-type的值设置为getPhoneNumber,当用户点击并同意之后,可以通过bindgetphonenumber事件回调获取到微信服务器返回的加密数据,然后在第三方服务端结合session_key以及app_id进行解密获取手机号。2.getPhoneNumber函数的执行时间:
由粗体部分内容可知bindgetphonenumber绑定的是open-type为getPhoneNumber的按钮触发调用获取用户手机号API的回调事件事件,而非单击事件。
经验证,从按钮点击到回调事件响应是有一定延迟的,而且会受网络及微信服务器影响(回调事件开头可以写个console.log(e),就能在开发这工具控制台监控到这个延迟了)。
如果网络非常卡——那么等微信服务器响应的时间可能就比较长了(iphone6plus,iphone7plus比较明显,延迟1000ms以上甚至无反应的感觉)
1Page({2getPhoneNumber:function(e){3console.log(e.detail.errMsg)4console.log(e.detail.iv)5console.log(e.detail.encryptedData)6}7})所以,即使你在getPhoneNumber方法中写了loading的代码,也只能等微信服务器响应之后才能生效了,这并不符合我们的需求。那么怎么解决这个问题呢?
解决方法:
方法其实很简单,真的很简单——使用bindtap绑定一个单击事件就可以了。虽然这是一个特殊的按钮,但本质上还是一个按钮的,单击事件仍然是有的。
被官方文档误导了,一直强调getPhoneNumber这个绑定的回调事件,且在取消、确认授权及获取加密数据操作都是在这个事件中处理的,潜意识中已经以为这就是这个特殊按钮单击事件了。
给getPhoneNumber按钮绑定一个单击事件,如下:
buttonopen-type="getPhoneNumber"bindgetphonenumber="getPhoneNumber"bindtap='showLoading'style='background:url({{btnImg}})topcenterno-repeat;background-size:cover;border:0px;color:#ffffff;'plain="true"获取用户手机号码/button1/2获取手机号码单击事件(在回调事件之前执行,预先显示loading,防授权弹窗弹出延迟)3loading使用自定义组件(小程序原生loading加载有延迟,无法完全防止点击穿透)4/5showLoading:function(){6this.setData({7loading:true8})9}如此,问题解决,在点击按钮的时候,就能及时显示loading。
个人原创博客,转载请注明来源地址:https://www.cnblogs.com/xyyt/p/9729578.html

版权声明

即速应用倡导尊重与保护知识产权。如发现本站文章存在版权问题,烦请提供版权疑问、身份证明、版权证明、联系方式等发邮件至197452366@qq.com ,我们将及时处理。本站文章仅作分享交流用途,作者观点不等同于即速应用观点。用户与作者的任何交易与本站无关,请知悉。

产品经理

手机 : 13312967497

擅长 : 小程序流量变现

扫码领取礼包

热门模板

  • 头条
  • 搜狐
  • 微博
  • 百家
  • 一点资讯
  • 知乎