vue3 uniapp微信登錄功能實現(xiàn)
根據(jù)最新的微信小程序官方的規(guī)定,uniapp中的uni.getUserInfo方法不再返回用戶頭像和昵稱、以及手機號
首先,需獲取appID,appSecret,如下圖
先調(diào)用uni.getUserInfo方法獲取code,然后調(diào)用后臺的api,傳入code,換取登錄信息比如openid什么的,然后調(diào)用后臺的例如賬號密碼或者手機驗證碼等相關(guān)登錄的接口,換取token存入本地,即可。
uni.getUserInfo({ provider: 'weixin', success: function(info) { // 獲取用戶信息成功, info.authResult保存用戶信息 uni.login({ provider: 'weixin', success: function(loginRes) { console.log(loginRes, '---loginRes') wxLoginApi({ code: loginRes.code }).then(res => { if (res.code === '200') { loginParamObj.value = res.data; if (loginParamObj.value.bindStatus === '1') { //已綁定,直接登錄 // userStore.SET_FRESH_TOKEN(res.data.refresh_token) } else { // 留在登錄頁 initLoginStatus.value = true } } }) }, fail: function(err) { // 登錄授權(quán)失敗 // err.code是錯誤碼 } }); } })
登錄后要配合pinia,將token存入本地即可
import { defineStore } from 'pinia' const user = defineStore( 'user', () => { const token = ref(''); // 登錄token const fresh_token = ref(''); const SET_TOKEN = (value : string) => { token.value = value }; const SET_FRESH_TOKEN = (value : string) => { fresh_token.value = value }; return { token, fresh_token, } }, { unistorage: true // 開啟后對 state 的數(shù)據(jù)讀寫都將持久化 }) // const user = ()=>{ // } export default user
到此這篇關(guān)于vue3 uniapp微信登錄的文章就介紹到這了,更多相關(guān)vue3 uniapp微信登錄內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
js實現(xiàn)翻頁后保持checkbox選中狀態(tài)的實現(xiàn)方法
在項目中有需求如下:上下分頁后,選中的checkbox狀態(tài)保持不變2012-11-11div+css+js模擬tab切換效果 事件綁定 IE,firefox兼容
div+css+js模擬tab,這個版本,理論上可以添加無限個tab,而且,你只要管內(nèi)容的添加行了,不需要改JS2009-12-12JavaScript高級程序設(shè)計 閱讀筆記(七) ECMAScript中的語句
ECMAScript中的語句,學(xué)習(xí)js的朋友可以參考下2012-02-02JS控制頁面跳轉(zhuǎn)時未請求要跳轉(zhuǎn)的地址怎么回事
在js中通過window.location.href控制頁面跳轉(zhuǎn)時,有時會跳轉(zhuǎn)至緩存頁面,并沒有真正去請求要跳轉(zhuǎn)的地址,導(dǎo)致頁面數(shù)據(jù)未能及時加載刷新。怎么解決呢?下面小編給大家解答下2016-10-10