微信小程序 上传头像的实例详解
最近在做微信小程序上传头像和上传照片功能就随手写一下代码：
上传头像html：
<view> <text>头像</text> <view> <image src="https://www.jb51.net/{{avatar}}" bindtap='changeAvatar'></image> </view> </view>
js代码：
// 切换头像 changeAvatar: function () { var that = this; // var childId = wx.getStorageSync("child_id"); // var token = wx.getStorageSync('token'); wx.chooseImage({ count: 1, // 最多可以选择的图片张数，默认9 sizeType: ['compressed'], // original 原图，compressed 压缩图，默认二者都有 sourceType: ['album', 'camera'], // album 从相册选图，camera 使用相机，默认二者都有 success: function (res) { console.log(res.tempFilePaths + "修改页面") var avatar = res.tempFilePaths; that.setData({ avatar: avatar, upAvatar:true }) }, fail: function () { // fail }, complete: function () { // complete } }) }, 这是是调用上传头像uploadFile方法 // 上传头像 app.uploadimg({ url: 'URL地址', path: avatar, header: { 'Content-Type': 'multipart/form-data', "Authorization": "Bearer " + token }, isShow: false }); 上传头像代码uploadFile做了一个封装 代码放在APP.js里 //多张图片上传 uploadimg:function(data){ var that= this, i=data.i ? data.i : 0, success=data.success ? data.success : 0, fail=data.fail ? data.fail : 0; wx.uploadFile({ url: data.url, filePath: data.path[i], name: 'fileData',//这里根据自己的实际情况改 header: data.header, formData: { sequence:i+1 }, success: (resp) => { success++; console.log(resp) console.log(i+"成功"); } }, fail: (res) => { fail++; console.log('fail:' + i + "fail:" + fail); }, complete: () => { console.log(i); i++; if (i == data.path.length) { //当图片传完时，停止调用 console.log('执行完毕'); console.log('成功：' + success + " 失败：" + fail); } else {//若图片还没有传完，则继续调用函数 console.log(i); data.i = i; data.success = success; data.fail = fail; that.uploadimg(data); } } }); },
uploadFile 提交默认是post方法，后台给的接口的时候需要后台做成post