uni-app获取用户头像和昵称

微信官方提供的wx.getUserInfo接口微信官方已收回，无法再获取到用户的信息，获取到的只有加密后的信息，只有一个灰白头像和昵称为微信用户的信息，其余的信息都是空的。还有wx.getUserProfile以及open-type开放标签也是一样的效果，这使得获取用户信息变成了用户主动的行为，不操作就获取不到，即用户不点击就只能用哦人的头像和昵称，是否显示自己微信的信息主动权到了用户的手里。

只能通过用户填写功能来实现，当用户点击按钮时，能够获取到微信头像，选择使用微信头像或者上传。页面中设计的头像区域一般不会放按钮，但实现上传功能又要用到按钮的开放能力。可以用按钮包裹图片，删除掉按钮的默认样式。 使用时需将按钮的open-type设置为chooseAvatar 并设置回调

 <button
    class="avatar-wrapper"
    :plain="true"
    open-type="chooseAvatar"
    @chooseavatar="onChooseAvatar"
  >
  <u-image
    :src="userIcon"
    width="156rpx"
    height="156rpx"
    shape="circle"
  ></u-image>
 </button>
 
 function onChooseAvatar(e) {
    // 获取到微信头像临时地址
    const { avatarUrl } = e.detail;
    // 上传文件到服务器
    console.log(avatarUrl);
  }

效果如下

获取昵称则更简便一点，需要用到input标签，将类型设置为昵称输入键盘，将type设置为nickname，聚焦时会自动弹出pop层获取到微信昵称。

<input
    name="nickname"
    type="nickname"
    placeholder="请输入昵称"
    :value="nickname"
    class="nickname-input"
/>

效果如下