實例講解微信小程式取得手機號碼授權使用者登入功能

小云云
發布: 2018-05-15 11:10:42
原創
22943 人瀏覽過

小程式中有很多地方都會用到註冊用戶資料的地方,用戶需要填寫手機號碼等,有了這個元件可以快速取得微信綁定手機號碼,無須用戶填寫。本文主要跟大家分享微信小程式取得手機號碼授權使用者登入功能,需要的朋友參考下吧,希望能幫助大家。

1.getPhoneNumber這個元件透過button來實現(別的標籤無效)。將button中的open-type=“getPhoneNumber”,並且綁定bindgetphonenumber事件取得回調。

<span style="font-size:14px;"><button open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber"></button></span>
登入後複製

2.在使用這個元件之前必須先呼叫login接口,如果沒有呼叫login點擊button時會提示先呼叫login。

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

3.透過bindgetphonenumber綁定的事件來取得回呼。回呼的參數有三個,

errMsg:使用者點擊取消或授權的資訊回呼。

iv:加密演算法的初始向量(如果使用者沒有同意授權則為undefined)。

encryptedData: 使用者資訊的加密資料(如果使用者沒有同意授權同樣回傳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) { }  
   })  
  }  
 }
登入後複製

4.最後我們需要根據自己的業務邏輯來進行處理,如果使用者不同意授權的話可能我們會有一個讓他手動輸入的介面,如果不是強制獲取手機號碼的話可以直接跳轉頁面進行下一步。 (使用者不同意授權errMsg返回'getPhoneNumber:fail user deny')

5.使用者同意授權,我們可以根據login時取得到的code來透過後台以及微信處理拿到session_key,最後透過app_id,session_key,iv,encryptedData(使用者同意授權errMsg返回'getPhoneNumber:ok')

又學會一種小程式功能,希望能幫助大家。

相關推薦:

PHP取得手機號碼的正規表示式寫法

微信小程式實作同步請求授權的實例分析

總結關於驗證與授權注意點

#

以上是實例講解微信小程式取得手機號碼授權使用者登入功能的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
最新問題
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板