微信小程序登錄獲取不到頭像和昵稱的詳細(xì)解決辦法

更新時間：2022年12月28日 11:57:15 作者：linlinlove2

相信好多小伙伴在使用getUserInfo獲取小程序用戶昵稱和頭像時卻獲取不到,下面這篇文章主要給大家介紹了關(guān)于微信小程序登錄獲取不到頭像和昵稱的詳細(xì)解決辦法,需要的朋友可以參考下

微信小程序登錄獲取不到頭像和昵稱主要原因是：小程序wx.getUserProfile接口被收回！

大家可以按照文檔操作↓

PS：

針對小程序wx.getUserProfile接口將被收回后做出的授權(quán)調(diào)整

小程序文檔中提出的調(diào)整說明

對于此次變化，現(xiàn)將小程序授權(quán)方式做以調(diào)整

添加判斷當(dāng)前基礎(chǔ)庫是否支持頭像昵稱填寫能力

在根目錄App.vue中加入判斷基礎(chǔ)庫是否大于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中加入基礎(chǔ)庫判斷，決定授權(quán)邏輯

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）調(diào)整pages/users/user_info.vue文件

data中添加

mp_is_new: this.$Cache.get('MP_VERSION_ISNEW') || false

（2）調(diào)整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: '上傳圖片失敗'
			});
		}
	})
},

總結(jié)

到此這篇關(guān)于微信小程序登錄獲取不到頭像和昵稱解決的文章就介紹到這了,更多相關(guān)微信小程序登錄獲取不到頭像昵稱內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

您可能感興趣的文章: