¡Se ha ajustado la capacidad de obtener avatares de usuario y apodos para los applets de WeChat! ¡Una nueva alternativa!

Anuncio de ajuste de interfaz

Hace algún tiempo, WeChat emitió el "Ajuste de las reglas para obtener el avatar y el apodo del usuario del miniprograma", diciendo que en la práctica, se descubrió que algunos programas pequeños requerían la recopilación del apodo y la imagen de perfil de WeChat del usuario cuando el usuario acababa de abrir el mini programa, o en una ruta irrazonable como antes del pago Se requiere autorización.

Si el usuario se niega a autorizar, no se puede utilizar el applet ni las funciones relacionadas. Cuando se ha obtenido la información de openId y unionId del usuario, el apodo y el avatar de WeChat del usuario no son condiciones necesarias para que el usuario use el Mini Programa. Para reducir tal autorización forzada irrazonable,  wx.getUserProfile se retirará la interfaz del subprograma y wx.getUserInfo se retirará la interfaz para obtener el apodo y el avatar del usuario.

nueva alternativa

Para resolver este problema, el Mini Programa ofrece oficialmente la posibilidad de completar el apodo del avatar. Cuando el Mini Programa necesita permitir que los usuarios completen su información personal, pueden completarla rápidamente a través del avatar y el apodo proporcionados por WeChat.

Cuando hace clic en el avatar, puede obtener directamente la dirección temporal del avatar. Cuando hace clic en el cuadro de entrada, puede obtener su apodo de WeChat y puede completar directamente el apodo de WeChat en el cuadro de entrada.

índice.wxml

<button class="avatar" open-type="chooseAvatar" bind:chooseavatar="onChooseAvatar">
  <image src="{
   
   {avatarUrl}}"></image>
</button> 
<input type="nickname" class="weui-input" placeholder="请输入昵称"/>

 índice.js

const defaultAvatarUrl = 'https://mmbiz.qpic.cn/mmbiz/icTdbqWNOwNRna42FI242Lcia07jQodd2FJGIYQfG0LAJGFxM4FbnQP6yfMxBgJ0F3YRqJCJ1aPAK2dQagdusBZg/0'

Page({
  data: {
    avatarUrl: defaultAvatarUrl,
  },
  onChooseAvatar(e) {
    const { avatarUrl } = e.detail 
    this.setData({
      avatarUrl,
    })
  }
})

índice.wxss

.avatar{
      width: 80px;
      height: 80px;
      padding:0;
      background: none;
}
.avatar image{
      width: 80px;
      height: 80px;
      border-radius: 100px;
}
.weui-input{
      width: 90%;
      height: 60px;
      margin:20px auto;
      background: #eee;
      border-radius: 5px;
      padding-left: 15px;
}

De esta forma, se pueden eliminar aquellos applets que fuerzan la autorización para obtener avatares y nicks. Sin embargo, tal castración de esta función aún reduce la experiencia del usuario.

Cabe señalar aquí: el avatar obtenido es una dirección temporal, no lo guarde en la base de datos, la dirección temporal dejará de ser válida, la forma correcta es cargar el wx.uploadFileavatar de la dirección temporal en su servidor para su almacenamiento a través de esta interfaz, y obtener la dirección permanente.

const defaultAvatarUrl = 'https://mmbiz.qpic.cn/mmbiz/icTdbqWNOwNRna42FI242Lcia07jQodd2FJGIYQfG0LAJGFxM4FbnQP6yfMxBgJ0F3YRqJCJ1aPAK2dQagdusBZg/0'

Page({
  data: {
    avatarUrl: defaultAvatarUrl,
  },
  onChooseAvatar(e) {
    const { avatarUrl } = e.detail 
    this.setData({
      avatarUrl,
    })
    //  将头像上传到服务器
    wx.uploadFile({
      url: 'https://example.weixin.qq.com/upload',
      filePath: tempFilePaths[0],
      name: 'file',
      success (res){
        const data = res.data
        //do something
      }
    })
  }
})

Autor: TANKING
WeChat: sansure2016 ¡
Si quieres saber más, puedes contactarme!