微信小程序如何通過用戶授權(quán)獲取手機(jī)號(hào)(getPhoneNumber)
這篇文章主要介紹了微信小程序如何通過用戶授權(quán)獲取手機(jī)號(hào)(getPhoneNumber),文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下
小程序有一個(gè)獲取用戶很便捷的api，就是通過getPhoneNumber獲取用戶的已經(jīng)綁定微信的手機(jī)號(hào)碼。有一點(diǎn)要大家注意，現(xiàn)在微信和注重用戶體驗(yàn)，有些方法都是需要用戶主動(dòng)去觸發(fā)才能調(diào)用的，比如getPhoneNumber。
官方文檔：https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/getPhoneNumber.html
實(shí)現(xiàn)思路：
直接上干貨：
1、
<button open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber"></button>
2、JS內(nèi)getPhoneNumbe組件函數(shù)（該事件中最重要的就是在wx.login登錄后發(fā)起接口請(qǐng)求），這里需要配置參數(shù)來給接口：
這些是必不可少的參數(shù)，這些齊備才能算一個(gè)合法的請(qǐng)求。
appid: “你的小程序APPID”, secret: “你的小程序appsecret”, code: res.code, encryptedData: telObj, iv: ivObj
//通過綁定手機(jī)號(hào)登錄
getPhoneNumber: function (e) {
var ivObj = e.detail.iv
var telObj = e.detail.encryptedData
var codeObj = "";
var that = this;
//------執(zhí)行Login---------
wx.login({
success: res => {
console.log('code轉(zhuǎn)換', res.code);
//用code傳給服務(wù)器調(diào)換session_key
wx.request({
url: 'https://你的接口文件路徑', //接口地址
data: {
appid: "你的小程序APPID",
secret: "你的小程序appsecret",
code: res.code,
encryptedData: telObj,
iv: ivObj
},
success: function (res) {
phoneObj = res.data.phoneNumber;
console.log("手機(jī)號(hào)=", phoneObj)
wx.setStorage({ //存儲(chǔ)數(shù)據(jù)并準(zhǔn)備發(fā)送給下一頁使用
key: "phoneObj",
data: res.data.phoneNumber,
})
}
})
//-----------------是否授權(quán)，授權(quán)通過進(jìn)入主頁面，授權(quán)拒絕則停留在登陸界面
if (e.detail.errMsg == 'getPhoneNumber:user deny') { //用戶點(diǎn)擊拒絕
wx.navigateTo({
url: '../index/index',
})
} else { //允許授權(quán)執(zhí)行跳轉(zhuǎn)
wx.navigateTo({
url: '../test/test',
})
}
}
});
},
最終結(jié)果展示：
點(diǎn)擊"拒絕"，開發(fā)者能捕捉到該事件 ，此時(shí)getPhoneNumber 函數(shù)返回 e.detail.errMsg 為 getPhoneNumber:user deny
以上就是本文的全部內(nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
微信小程序input框中加入小圖標(biāo)的實(shí)現(xiàn)方法
這篇文章主要介紹了微信小程序input框中加入小圖標(biāo)的實(shí)現(xiàn)方法，非常不錯(cuò)，具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2018-06-06
作為一個(gè)程序員，代碼實(shí)現(xiàn)才是能力體現(xiàn)，在大部分面試的時(shí)候，我們都會(huì)被要求手寫代碼實(shí)現(xiàn)一個(gè)功能，本文總結(jié)了一下經(jīng)常被面試官問到的節(jié)流和防抖功能的實(shí)現(xiàn)，分享給有需要的小伙伴2023-07-07
使用JS實(shí)現(xiàn)鼠標(biāo)放上圖片進(jìn)行放大離開實(shí)現(xiàn)縮小功能
這篇文章主要介紹了使用JS實(shí)現(xiàn)鼠標(biāo)放上圖片進(jìn)行放大離開實(shí)現(xiàn)縮小功能,本文通過實(shí)例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2021-01-01
為了兼容各種瀏覽器，今天沒事特意復(fù)習(xí)了一下js原生事件特性，對(duì)其封裝一下。2013-04-04
javascript實(shí)現(xiàn)簡(jiǎn)單放大鏡效果
這篇文章主要為大家詳細(xì)介紹了javascript實(shí)現(xiàn)簡(jiǎn)單放大鏡效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-09-09
中文亂碼在Java Web開發(fā)中經(jīng)常出現(xiàn)，這是由于不同的部分編碼不一樣造成的，一般在開發(fā)中，我們把所有能設(shè)編碼的地方，全部設(shè)置成UTF-8，但是有時(shí)候還是會(huì)出現(xiàn)亂碼的情況。下面通過本文給大家分享JS外部文件中文注釋出現(xiàn)亂碼的解決方案，一起看看吧2017-07-07
這篇文章主要介紹了 Jasper的自動(dòng)檢測(cè)實(shí)現(xiàn)的機(jī)制比較簡(jiǎn)單，依靠某后臺(tái)線程不斷檢測(cè)JSP文件與編譯后的class文件的最后修改時(shí)間是否相同，若相同則認(rèn)為沒有改動(dòng)，但倘若不同則需要重新編譯,需要的朋友可以參考下2016-12-12
JS實(shí)現(xiàn)勻加速與勻減速運(yùn)動(dòng)的方法示例
這篇文章主要介紹了JS實(shí)現(xiàn)勻加速與勻減速運(yùn)動(dòng)的方法,涉及javascript結(jié)合時(shí)間函數(shù)與數(shù)學(xué)運(yùn)算動(dòng)態(tài)操作頁面元素樣式的相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下2017-09-09
javascript計(jì)算星座屬相(十二生肖屬相)示例代碼
本文介紹了使用javascript計(jì)算星座和屬相的示例，這個(gè)可以用在用戶注冊(cè)的時(shí)候顯示出來，大家參考使用吧2014-01-01
這篇文章主要介紹了JS異步加載進(jìn)度條 的相關(guān)資料,需要的朋友可以參考下2016-05-05