uni-app微信小程序登錄授權(quán)的實(shí)現(xiàn)
微信小程序授權(quán)是非常簡(jiǎn)單和常用的功能,但為了方便,還是在此記錄一下要點(diǎn):
首先是需要用到一個(gè)授權(quán)按鈕來(lái)觸發(fā)獲取用戶(hù)信息授權(quán): 關(guān)鍵在于 open-type 為 getUserInfo , 然后有個(gè)@getuserinfo的事件,把獲取授權(quán)接口寫(xiě)到該事件里面去
<button class="sys_btn" open-type="getUserInfo" lang="zh_CN" @getuserinfo="appLoginWx">{{loginInfo.openid != "" && loginInfo.openid != undefined ? "已授權(quán)" : "小程序授權(quán)"}}</button>
方法如下:
appLoginWx(){ // #ifdef MP-WEIXIN uni.getProvider({ service: 'oauth', success: function (res) { if (~res.provider.indexOf('weixin')) { uni.login({ provider: 'weixin', success: (res) => { _self.authorization = res.code; uni.getUserInfo({ provider: 'weixin', success: (info) => {//這里請(qǐng)求接口 console.log(res); console.log(info); }, fail: () => { uni.showToast({title:"微信登錄授權(quán)失敗",icon:"none"}); } }) }, fail: () => { uni.showToast({title:"微信登錄授權(quán)失敗",icon:"none"}); } }) }else{ uni.showToast({ title: '請(qǐng)先安裝微信或升級(jí)版本', icon:"none" }); } } }); //#endif }
在 uni.login 和 uni.getUserInfo 被調(diào)用后,你可以獲取到以下值用于繼續(xù)請(qǐng)求后端給你的接口:
常用的值大概有:code 、iv 、encryptedData 和 個(gè)人基本信息,這些可以傳給后端交換得到openid。
如果需要知道用戶(hù)當(dāng)前是否已經(jīng)授權(quán),則可以使用如下代碼:
uniapp的授權(quán)文檔,可以判斷不同的授權(quán)類(lèi)型:https://uniapp.dcloud.io/api/other/authorize?id=authorize
// #ifdef MP-WEIXIN uni.getSetting({ success(res) { console.log("授權(quán):",res); if (!res.authSetting['scope.userInfo']) { //這里調(diào)用授權(quán) console.log("當(dāng)前未授權(quán)"); } else { //用戶(hù)已經(jīng)授權(quán)過(guò)了 console.log("當(dāng)前已授權(quán)"); } } }) //#endif
到此這篇關(guān)于uni-app微信小程序登錄授權(quán)的實(shí)現(xiàn)的文章就介紹到這了,更多相關(guān)uni-app小程序登錄授權(quán)內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
Javascript對(duì)象Clone實(shí)例分析
這篇文章主要介紹了Javascript對(duì)象Clone用法,實(shí)例分析了javascript對(duì)象克隆的相關(guān)技巧,需要的朋友可以參考下2015-06-06js String.prototype.trim字符去前后空格的擴(kuò)展
這篇文章主要介紹了js String.prototype.trim字符去前后空格的擴(kuò)展,需要的朋友可以參考下2020-04-04JavaScript實(shí)現(xiàn)隨機(jī)點(diǎn)名小程序
這篇文章主要介紹了JavaScript實(shí)現(xiàn)隨機(jī)點(diǎn)名小程序,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2020-10-10Web純前端“旭日?qǐng)D”實(shí)現(xiàn)元素周期表
本文主要介紹了Web純前端“旭日?qǐng)D”實(shí)現(xiàn)元素周期表的實(shí)例解析。具有很好的參考價(jià)值。下面跟著小編一起來(lái)看下吧2017-03-03關(guān)于JS中一維數(shù)組和二維數(shù)組互轉(zhuǎn)問(wèn)題
這篇文章主要介紹了js中一維數(shù)組和二維數(shù)組互轉(zhuǎn),本文結(jié)合示例代碼給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2022-04-04js 頁(yè)面?zhèn)鲄?shù)時(shí) 參數(shù)值含特殊字符的問(wèn)題
解決方法就是利用js的escape函數(shù),這個(gè)函數(shù)在解決中文亂碼等方面應(yīng)用的比較廣泛。推薦使用。2009-12-12微信小程序自定義select下拉選項(xiàng)框組件的實(shí)現(xiàn)代碼
微信小程序中沒(méi)有select下拉選項(xiàng)框,所以只有自定義。這篇文章主要介紹了微信小程序自定義select下拉選項(xiàng)框組件,需要的朋友可以參考下2018-08-08JavaScript中常見(jiàn)的繼承方式總結(jié)
這篇文章主要和大家詳細(xì)介紹了JavaScript中常見(jiàn)的幾種繼承方式,文中的示例代碼講解詳細(xì),對(duì)我們學(xué)習(xí)JavaScript有一定幫助,需要的小伙伴可以參考下面文章詳細(xì)內(nèi)容2022-11-11webpack3升級(jí)到webpack4遇到問(wèn)題總結(jié)
這篇文章主要介紹了webpack3升級(jí)到webpack4遇到問(wèn)題總結(jié),文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-09-09