From 2af29c604ba8b06aa281e7649b33c4019aaba4c0 Mon Sep 17 00:00:00 2001 From: H1d3rOne Date: Mon, 9 Mar 2026 00:35:48 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E4=B8=BA=E5=BE=AE=E4=BF=A1?= =?UTF-8?q?=E5=AE=98=E6=96=B9=E6=8E=A8=E8=8D=90=E7=9A=84=E6=96=B0=E6=96=B9?= =?UTF-8?q?=E5=BC=8F=E8=8E=B7=E5=8F=96=E5=A4=B4=E5=83=8F=E5=92=8C=E6=98=B5?= =?UTF-8?q?=E7=A7=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 问题： - getUserProfile API已被微信废弃 - getUserInfo API无法获取用户信息 - 导致无法获取微信头像和昵称 解决方案： - 使用button组件的open-type="chooseAvatar"获取头像 - 使用input组件的type="nickname"获取昵称 - 这是微信官方推荐的新方式 前端实现： - 头像按钮：open-type="chooseAvatar" @chooseavatar事件 - 昵称输入框：type="nickname" 自动填充微信昵称 - 简化登录流程，移除getUserProfile调用 - 使用async/await优化代码结构 功能特点： - 用户点击头像按钮选择微信头像 - 用户点击昵称输入框自动填充微信昵称 - 支持手动输入昵称 - 更符合微信小程序最新规范 --- xuan-deduct-uniapp/src/pages/auth/auth.vue | 189 +++++++++------------ 1 file changed, 84 insertions(+), 105 deletions(-) diff --git a/xuan-deduct-uniapp/src/pages/auth/auth.vue b/xuan-deduct-uniapp/src/pages/auth/auth.vue index fe0c666..a9d79cf 100644 --- a/xuan-deduct-uniapp/src/pages/auth/auth.vue +++ b/xuan-deduct-uniapp/src/pages/auth/auth.vue @@ -9,16 +9,19 @@ - + - - - 获取昵称 - + @@ -52,32 +55,25 @@ export default { } }, methods: { - chooseAvatar() { - uni.chooseImage({ - count: 1, - sizeType: ['compressed'], - sourceType: ['album', 'camera'], - success: (res) => { - if (res.tempFilePaths && res.tempFilePaths.length > 0) { - this.avatarUrl = res.tempFilePaths[0] - } - } - }) + onChooseAvatar(e) { + console.log('选择头像:', e) + const { avatarUrl } = e.detail + if (avatarUrl) { + this.avatarUrl = avatarUrl + console.log('头像URL:', avatarUrl) + } }, - getNickname() { - uni.getUserInfo({ - provider: 'weixin', - success: (res) => { - if (res.userInfo) { - this.nickname = res.userInfo.nickName - if (res.userInfo.avatarUrl) { - this.avatarUrl = res.userInfo.avatarUrl - } - } - } - }) + + onNicknameInput(e) { + console.log('输入昵称:', e) + const value = e.detail.value + if (value) { + this.nickname = value + console.log('昵称:', value) + } }, - doAuth() { + + async doAuth() { if (!this.avatarUrl) { uni.showToast({ title: '请选择头像', icon: 'none' }) return @@ -85,67 +81,54 @@ export default { this.loading = true - uni.getUserProfile({ - desc: '用于完善用户资料', - success: (profileRes) => { - console.log('获取用户信息成功:', profileRes) - - const userInfo = profileRes.userInfo - const nickname = userInfo.nickName || this.nickname || '微信用户' - const avatarUrl = userInfo.avatarUrl || this.avatarUrl - + try { + const loginRes = await new Promise((resolve, reject) => { uni.login({ - success: (loginRes) => { - if (loginRes.code) { - console.log('获取code成功:', loginRes.code) - - api.userApi.loginOrRegister({ - code: loginRes.code, - nickname: nickname, - avatarUrl: avatarUrl - }).then(res => { - this.loading = false - if (res.success) { - console.log('登录成功:', res.data) - uni.setStorageSync('userId', res.data.userId) - uni.setStorageSync('userInfo', JSON.stringify(res.data)) - uni.setStorageSync('userCoins', res.data.coins || 10) - uni.setStorageSync('vipLevel', res.data.vipLevel || 0) - uni.setStorageSync('username', res.data.username || res.data.nickname) - uni.setStorageSync('userAvatar', res.data.avatarUrl) - - uni.showToast({ title: '登录成功', icon: 'success' }) - - setTimeout(() => { - uni.switchTab({ url: '/pages/index/index' }) - }, 1500) - } else { - uni.showToast({ title: res.error || '登录失败', icon: 'none' }) - } - }).catch((err) => { - this.loading = false - console.error('登录失败:', err) - uni.showToast({ title: '网络错误', icon: 'none' }) - }) - } else { - this.loading = false - uni.showToast({ title: '获取授权失败', icon: 'none' }) - } - }, - fail: (err) => { - this.loading = false - console.error('uni.login失败:', err) - uni.showToast({ title: '登录失败', icon: 'none' }) - } + success: resolve, + fail: reject }) - }, - fail: (err) => { - this.loading = false - console.error('getUserProfile失败:', err) - uni.showToast({ title: '获取用户信息失败', icon: 'none' }) + }) + + if (!loginRes.code) { + throw new Error('获取授权失败') } - }) + + console.log('获取code成功:', loginRes.code) + + const res = await api.userApi.loginOrRegister({ + code: loginRes.code, + nickname: this.nickname || '微信用户', + avatarUrl: this.avatarUrl + }) + + if (res.success) { + console.log('登录成功:', res.data) + uni.setStorageSync('userId', res.data.userId) + uni.setStorageSync('userInfo', JSON.stringify(res.data)) + uni.setStorageSync('userCoins', res.data.coins || 10) + uni.setStorageSync('vipLevel', res.data.vipLevel || 0) + uni.setStorageSync('username', res.data.username || res.data.nickname) + uni.setStorageSync('userAvatar', res.data.avatarUrl) + + uni.showToast({ title: '登录成功', icon: 'success' }) + + setTimeout(() => { + uni.switchTab({ url: '/pages/index/index' }) + }, 1500) + } else { + throw new Error(res.error || '登录失败') + } + } catch (err) { + console.error('登录失败:', err) + uni.showToast({ + title: err.message || '网络错误', + icon: 'none' + }) + } finally { + this.loading = false + } }, + skipAuth() { uni.switchTab({ url: '/pages/index/index' }) } @@ -215,29 +198,36 @@ page { width: 100%; } -.auth-avatar { +.auth-avatar-btn { width: 160rpx; height: 160rpx; margin: 0 auto 24rpx; position: relative; + background: transparent; + border: none; + padding: 0; + display: flex; + flex-direction: column; + align-items: center; +} + +.auth-avatar-btn::after { + border: none; } .avatar-img { - width: 100%; - height: 100%; + width: 160rpx; + height: 160rpx; border-radius: 50%; } .auth-tip { - position: absolute; - bottom: -10rpx; - left: 50%; - transform: translateX(-50%); font-size: 22rpx; color: #10B981; background: rgba(255, 255, 255, 0.9); padding: 4rpx 16rpx; border-radius: 16rpx; + margin-top: 10rpx; } .auth-nickname { @@ -255,17 +245,6 @@ page { color: #065F46; } -.get-nickname-btn { - background: linear-gradient(135deg, #10B981 0%, #059669 100%); - padding: 20rpx 32rpx; - border-radius: 16rpx; -} - -.btn-text { - font-size: 26rpx; - color: #ffffff; -} - .tips-card { background: rgba(255, 255, 255, 0.95); border-radius: 24rpx;