微信小程序新版头像昵称API [保存用户头像到服务器]

 根据微信官方文档的说法,2022年10月之后,原本的获取昵称和头像的api,也就是wx.getUserProfile和wx.getUserInfo将停止支持,在那之后发布和更新的小程序必须停止使用这两个api。

微信小程序新版头像昵称API [保存用户头像到服务器]_第1张图片

 这两个api获得的用户头像均为一个url,指向网络上的一个头像图片。前端获取该链接后可通过wx.request传到后端,服务器访问该链接并将图片下载保存。

微信官方推荐的替代做法:头像昵称填写 | 微信开放文档 (qq.com)

代码(来自上述的链接):

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

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

必须让用户点击开发者设置的button标签,然后手动选择自己的微信头像,或者在相册中选择一张图片,button应该填的的属性见上图。

测试后发现,这种方法得到的avatarUrl是微信本地临时文件的路径,可以让小程序显示使用,但是不能在远程访问,也就是不能通过发送url给服务器的方式让服务器下载图片,必须把图片本身发送给服务器。所以我们可以使用wx.uploadFile,将刚刚保存在本地的头像发送至服务器

  onChooseAvatar(e) {
    var avatarUrl = e.detail 
    this.setData({
      avatarUrl,//让图片预览处显示刚刚选择的图片
    });
    wx.uploadFile({
      filePath: avatarUrl,
      name: 'avatarImg',
      url: uploadUrl,//服务器端接收图片的路径
      success:function(res){
        console.log(res);//发送成功回调
      },
      fail:function(res){
        console.log(res);//发送失败回调,可以在这里了解失败原因
      }
    })
  },

注意:wx.uploadFile所允许的域名白名单需要在小程序后台配置,与wx.request是分开的。配置之后记得清除本地缓存才会生效。

 

 

你可能感兴趣的:(微信小程序,小程序,c#)