微信小程序登錄獲取不到頭像和昵稱的詳細解決辦法
微信小程序登錄獲取不到頭像和昵稱主要原因是:小程序wx.getUserProfile接口被收回!
大家可以按照文檔操作↓
PS:
針對小程序wx.getUserProfile接口將被收回后做出的授權調整
小程序文檔中提出的調整說明
對于此次變化,現將小程序授權方式做以調整
添加判斷當前基礎庫是否支持頭像昵稱填寫能力
在根目錄App.vue中加入判斷基礎庫是否大于2.21.2版本(大于此版本支持頭像/昵稱填寫能力)
// #ifdef MP const version = uni.getSystemInfoSync().SDKVersion if (Routine.compareVersion(version, '2.21.2') >= 0) { that.$Cache.set('MP_VERSION_ISNEW', true) } else { that.$Cache.set('MP_VERSION_ISNEW', false) } // #endif
2.修改/pages/users/wechat_login.vue文件
(1) 在data中加入基礎庫判斷,決定授權邏輯
mp_is_new: this.$Cache.get('MP_VERSION_ISNEW') || false
(2)dom中新增邏輯判斷
(3) methods中加入方法userLogin
// 小程序 22.11.8日刪除getUserProfile 接口獲取用戶昵稱頭像 userLogin() { Routine.getCode() .then(code => { uni.showLoading({ title: '正在登錄中' }); authLogin({ code, spread_spid: app.globalData.spid, spread_code: app.globalData.code }).then(res => { if (res.data.key !== undefined && res.data.key) { uni.hideLoading(); this.authKey = res.data.key; this.isPhoneBox = true; } else { uni.hideLoading(); let time = res.data.expires_time - this.$Cache.time(); this.$store.commit('LOGIN', { token: res.data.token, time: time }); this.getUserInfo() } }) }) .catch(err => { console.log(err) }); },
3.新增用戶頭像/昵稱獲取能力
(1)調整pages/users/user_info.vue文件
data中添加
mp_is_new: this.$Cache.get('MP_VERSION_ISNEW') || false
(2)調整dom中
(3)methods中加入方法
onChooseAvatar(e) { const { avatarUrl } = e.detail this.$util.uploadImgs('upload/image', avatarUrl, (res) => { this.userInfo.avatar = res.data.url }, (err) => { console.log(err) }) },
這里有一個公共方法uploadImgs需要在/utils/util.js中添加
uploadImgs(uploadUrl, filePath, successCallback, errorCallback) { let that = this; uni.uploadFile({ url: HTTP_REQUEST_URL + '/api/' + uploadUrl, filePath: filePath, fileType: 'image', name: 'pics', formData: { 'filename': 'pics' }, header: { // #ifdef MP "Content-Type": "multipart/form-data", // #endif [TOKENNAME]: 'Bearer ' + store.state.app.token }, success: (res) => { uni.hideLoading(); if (res.statusCode == 403) { that.Tips({ title: res.data }); } else if (res.statusCode == 413) { that.Tips({ title: '上傳圖片失敗,請重新上傳小尺寸圖片' }); } else { let data = res.data ? JSON.parse(res.data) : {}; if (data.status == 200) { successCallback && successCallback(data) } else { errorCallback && errorCallback(data); that.Tips({ title: data.msg }); } } }, fail: (err) => { uni.hideLoading(); that.Tips({ title: '上傳圖片失敗' }); } }) },
總結
到此這篇關于微信小程序登錄獲取不到頭像和昵稱解決的文章就介紹到這了,更多相關微信小程序登錄獲取不到頭像昵稱內容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家!
相關文章
淺談JavaScript的innerWidth與innerHeight
下面小編就為大家?guī)硪黄獪\談JavaScript的innerWidth與innerHeight。小編覺得挺不錯的,現在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2017-10-10js隱藏與顯示回到頂部按鈕及window.onscroll事件應用
現在大多數網站都會添加這種功能:當滾動條滾動到頁面的下方時,頁面的右下角會顯示出來一個“回到頂部”的按鈕或連接;那么,如何控制“回到頂部”按鈕的顯示或隱藏呢;本文介紹詳細實現方法,感興趣的你可不要走開哦2013-01-01Javascript技術難點之apply,call與this之間的銜接
這篇文章主要介紹了Javascript技術難點之apply,call與this之間的銜接的相關資料,需要的朋友可以參考下2015-12-12微信小程序自定義navigationBar頂部導航欄適配所有機型(附完整案例)
這篇文章主要介紹了微信小程序自定義navigationBar頂部導航欄適配所有機型(附完整案例),文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧2020-04-04