背景

使用wx.getUserProfile 獲取用戶信息，但是不出現(xiàn)彈窗就直接獲取到了用戶信息，且返回灰色頭像，和“微信用戶”昵稱

原因

原來(lái)這個(gè)接口在22年5月的時(shí)候被回收了，低版本調(diào)試庫(kù)才會(huì)正常顯示，高版本則會(huì)返回灰色頭像和默認(rèn)的“微信用戶”昵稱

解決

我的解決方法是手動(dòng)加一個(gè)權(quán)限彈窗文章來(lái)源地址http://www.zghlxwxcb.cn/news/detail-507890.html

授權(quán)彈窗

async signupAndLogin() {            //bindtap事件
    wx.showModal({                     //手動(dòng)授權(quán)彈窗
      title: '授權(quán)登錄提示',
      content: '是否允許授權(quán)？',
      showCancel: true,
      confirmText: '允許',
      confirmColor: '#669F76',
      cancelColor: '#CC463D',
      success: async res => {
        if (res.confirm) {     //用戶確認(rèn)
          const { userInfo: { nickName, avatarUrl } } = await
            wx.getUserProfile({    //獲取用戶信息，最新版本已不支持彈窗
              desc: '用戶授權(quán)',
            })

          let { result } = await wx.cloud.callFunction({  // 調(diào)用云函數(shù)
            name: 'loginOrSignup',
            data: {
              nickName,
              avatarUrl
            }
          })
          this.setData({ userInfo: result })
          getApp().globalData.userStatus = true   //用于檢查用戶是否登錄的全局變量
        } else if (res.cancel) {     //用戶取消
          wx.showToast({
            title: '取消授權(quán)',
            mask: true,
            icon: 'error'
          })
        }
      }
    })
  },

loginOrSignup云函數(shù)

// 云函數(shù)入口文件
const cloud = require('wx-server-sdk')

cloud.init({ env: cloud.DYNAMIC_CURRENT_ENV }) // 使用當(dāng)前云環(huán)境
const db = cloud.database()
// 云函數(shù)入口函數(shù)
exports.main = async (event, context) => {
  const { OPENID } = cloud.getWXContext()
  const { nickName, avatarUrl } = event
  const user_clct = db.collection('user')

  const { data } = await user_clct.where({    //查詢用戶是否存在
    _openId: OPENID
  }).get()

  if (data.length === 0) {                     //如果用戶不存在，添加用戶
    let user = await user_clct.add({
      data: {
        nickName,
        avatarUrl,
        _openId: OPENID
      }
    })
    return {
      nickName,
      avatarUrl,
      _openId: OPENID
    }
  } else {
    return data[0]       //如果用戶存在，返回該用戶信息
  }
}

選擇頭像

<button class="chooseAvatar" open-type="chooseAvatar" bindchooseavatar="chooseAvatar" plain="ture" style="width: 160rpx; border: none;color: #6e6e6e;">
<image class="userAvatar" src="{{userInfo.avatarUrl}}"></image>
</button>
主要是open-type屬性，chooseAvatar是固定參數(shù)之一，用于拉起選擇頭像菜單

async chooseAvatar(e: any) {                //用戶更換頭像
    //e.detail 已經(jīng)是 avatarUrl："..."的格式
    let { avatarUrl } = e.detail

    wx.cloud.callFunction({
      name: 'uploadAvatar',
      data: {
        avatarUrl
      },
      success: async res => {
        let { result } = await wx.cloud.callFunction({  // 調(diào)用登錄云函數(shù)，不傳參，用以更新頁(yè)面中的用戶信息
          name: 'loginOrSignup',
        })
        this.setData({ userInfo: result })
      }
    })
  },

uploadAvatar，更新頭像

// 云函數(shù)入口文件
const cloud = require('wx-server-sdk')

cloud.init({ env: cloud.DYNAMIC_CURRENT_ENV }) // 使用當(dāng)前云環(huán)境
const db = cloud.database()
// 云函數(shù)入口函數(shù)
exports.main = async (event, context) => {
  const { OPENID } = cloud.getWXContext()
  const { avatarUrl } = event
  try {
    db.collection('user').where({
      _openId: OPENID
    }).update({
      data: {
        avatarUrl
      },
      success:res=>{
        return avatarUrl
      }
    })
  } catch (err) {
    return err
  }
}