Home > WeChat Applet > Mini Program Development > An example to explain the WeChat applet's function of obtaining authorized user login by mobile phone number

An example to explain the WeChat applet's function of obtaining authorized user login by mobile phone number

小云云
Release: 2018-05-15 11:10:42
Original
22956 people have browsed it

There are many places in the mini program where registered user information is used. Users need to fill in their mobile phone number, etc. With this component, you can quickly obtain the mobile phone number bound to WeChat without the user filling it in. This article mainly shares with you the WeChat applet function of obtaining authorized user login with mobile phone number. Friends who need it can refer to it. I hope it can help everyone.

1. The getPhoneNumber component is implemented through button (other tags are invalid). Set open-type="getPhoneNumber" in the button and bind the bindgetphonenumber event to get the callback.

<span style="font-size:14px;"><button open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber"></button></span>
Copy after login

2. The login interface must be called before using this component. If login is not called, when you click the button, you will be prompted to call login first.

App({  
  onLaunch: function () {  
    wx.login({  
      success: function (res) {  
        if (res.code) {  
          //发起网络请求  
          console.log(res.code)  
        } else {  
          console.log(&#39;获取用户登录态失败!&#39; + res.errMsg)  
        }  
      }  
    });  
  }  
})
Copy after login

3. Get the callback through the event bound to bindgetphonenumber. There are three parameters of the callback,

errMsg: the information callback when the user clicks to cancel or authorize.

iv: The initial vector of the encryption algorithm (undefined if the user does not agree to the authorization).

encryptedData: Encrypted data of user information (if the user does not agree to authorize, it will also return undefined)

getPhoneNumber: function(e) {   
  console.log(e.detail.errMsg)   
  console.log(e.detail.iv)   
  console.log(e.detail.encryptedData)   
  if (e.detail.errMsg == &#39;getPhoneNumber:fail user deny&#39;){  
   wx.showModal({  
     title: &#39;提示&#39;,  
     showCancel: false,  
     content: &#39;未授权&#39;,  
     success: function (res) { }  
   })  
  } else {  
   wx.showModal({  
     title: &#39;提示&#39;,  
     showCancel: false,  
     content: &#39;同意授权&#39;,  
     success: function (res) { }  
   })  
  }  
 }
Copy after login

4. Finally, we need to do it according to our own business logic Processing, if the user does not agree to the authorization, we may have an interface for him to enter manually. If it is not mandatory to obtain the mobile phone number, he can jump directly to the page and proceed to the next step. (The user does not agree to authorize errMsg and returns 'getPhoneNumber:fail user deny')

5. The user agrees to authorize. We can get the session_key through the background and WeChat processing based on the code obtained when logging in. Finally Through app_id, session_key, iv, encryptedData (the user agrees to authorize errMsg to return 'getPhoneNumber:ok')

I also learned a small program function, I hope it can help everyone.

Related recommendations:

Regular expression writing method for obtaining mobile phone number in PHP

Instance analysis of WeChat applet implementing synchronous request authorization

Summary of points to note about authentication and authorization

The above is the detailed content of An example to explain the WeChat applet's function of obtaining authorized user login by mobile phone number. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template