微信小程序获取用户头像
微信小程序的开发需要使用到用户的头像，获取头像主要通过微信开发者工具提供的API以及微信用户授权实现。下面介绍如何在微信小程序中获取用户头像并上传到服务器。
Step1. 获取用户头像的API
微信开发者工具提供了wx.getUserInfo API，该API可以用于获取用户的头像、昵称、性别等信息。在使用该API前需要先进行用户授权，否则无法获取用户信息。
Step2. 申请用户授权
在小程序中使用API需要先进行用户授权，申请授权需要在小程序的app.json中添加scope.userInfo属性，如下：
{
"pages": [
"pages/index/index",
"pages/logs/logs"
],
"window": {
"backgroundTextStyle": "light",
"navigationBarBackgroundColor": "#fff",
"navigationBarTitleText": "WeChat",
"navigationBarTextStyle": "black"
},
"tabBar": {
"list": [{
"pagePath": "pages/index/index",
"text": "首页"
}, {
"pagePath": "pages/logs/logs",
"text": "日志"
}]
},
"networkTimeout": {
"request": 10000,
"downloadFile": 10000
},
"debug": true,
"devTools": true,
"appId": "wx123456",
"scope": {
"userInfo": true
}
}
添加完scope.userInfo属性后，还需要在小程序的页面中使用button组件来触发用户授权事件，如下：
授权登录
授权登录后可以通过wx.getUserInfo API获取用户授权的信息：
wx.getUserInfo({
success: function(res) {
var userInfo = res.userInfo
var nickName = userInfo.nickName
var avatarUrl = userInfo.avatarUrl
var gender = userInfo.gender //性别 0：未知、1：男、2：女
var province = userInfo.province
var city = userInfo.city
var country = userInfo.country
}
})
Step3. 上传用户头像到服务器
获取用户头像后，可以使用wx.uploadFile API将头像上传到服务器。
wx.uploadFile({
url: 'http://example.com/upload', //服务器地址
filePath: tempFilePath,
name: 'file',
formData: {
'user': 'test'
},
success: function(res){
var data = res.data
//do something
}
})
上述代码中，url为服务器地址，filePath为头像的本地临时路径，name为服务器接收的文件名，formData为上传额外的参数，success为上传成功后的回调函数。
总结
本文介绍了如何在微信小程序中获取用户头像并上传到服务器，从获取用户授权开始到使用API获取用户头像信息，再到上传头像到服务器，逐步讲解如何实现相关功能。通过本文的学习，相信读者已经能够实现微信小程序获取用户头像上传到服务器的功能。
