微信小程序开发-单击按钮以获得用户授权，无响应或响应缓慢的解决方案

异常描述:

单击该按钮可获得用户的手机号码，有时会弹出一个窗口，对用户的点击不响应，或者很长一段时间后才授权用户获得该手机号码. 在这种情况下，也会发生点击渗透的问题（有关详细信息，请参见: 微信）. 小程序开发-例外处理，在快速连续单击按钮以调用小程序api后仍自动重新调用该程序）.

异常分析:

1. 使用getPhoneNumber:

对于getPhoneNumber（OBJECT）API，由于需要由用户触发小应用程序以启动对电话号码接口的获取，因此API不会调用此函数. 需要通过单击组件来触发它（请参阅getPhoneNumber（OBJECT））.

1 <button open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber"> </button> 

对于使用方法，官方文档中注明:

需要将 <button> 组件 open-type 的值设置为 getPhoneNumber，当用户点击并同意之后，可以通过 bindgetphonenumber 事件回调获取到微信服务器返回的加密数据， 然后在第三方服务端结合 session_key 以及 app_id 进行解密获取手机号。

2. getPhoneNumber函数的执行时间:

粗体内容表示bindgetphonenumber绑定到一个打开类型为getPhoneNumber的按钮，这将触发一个回调事件，该事件调用API来获取用户的电话号码，而不是click事件.

已验证从单击按钮到回调事件响应之间存在一定的延迟微信小程序调用时间，并且该延迟会受到网络和微信服务器的影响（控制台事件可以写在回调事件的开头. log （e），可以在开发工具控制台中对其进行监视（此延迟）.

如果网络非常拥塞-那么等待微信服务器响应的时间可能会更长（iphone 6 plus，iphone7 plus更明显，延迟超过1000ms甚至没有响应）

1 Page({ 
2     getPhoneNumber: function(e) { 
3         console.log(e.detail.errMsg) 
4         console.log(e.detail.iv) 
5         console.log(e.detail.encryptedData) 
6     } 
7 }) 

因此，即使您在getPhoneNumber方法中编写加载代码，也只能在微信服务器响应后才能生效，这无法满足我们的需求. 那么如何解决这个问题呢？

解决方案:

该方法实际上非常简单，非常简单-只需使用bindtap绑定click事件即可. 尽管这是一个特殊的按钮，但实际上它是一个按钮，并且仍然存在单击事件.

我被官方文档误导了，总是强调getPhoneNumber的回调事件是绑定的，取消，确认授权和获取加密数据的操作都在此事件中处理. 我下意识地认为这是特殊的按钮单击. 事件.

将点击事件绑定到getPhoneNumber按钮，如下所示:

<buttonopen-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber" bindtap=‘showLoading‘ 
style=‘background: url({{btnImg}})  top center no-repeat;background-size:cover;border:0px;color:#ffffff;‘ plain="true">获取用户手机号码</button>

1   /**
2    * 获取手机号码单击事件（在回调事件之前执行，预先显示loading,防授权弹窗弹出延迟）
3    * loading使用自定义组件（小程序原生loading加载有延迟，无法完全防止点击穿透）
4    */
5   showLoading:function(){
6     this.setData({
7       loading: true
8     })
9   }

因此微信小程序调用时间，该问题已解决，单击该按钮可以及时显示加载情况.

本文来自电脑杂谈，转载请注明本文网址：
http://www.pc-fly.com/a/tongxinshuyu/article-281956-1.html