Explication détaillée du téléchargement d'avatars via le mini-programme WeChat-Développement de mini-programmes-php.cn

Explication détaillée du téléchargement d'avatars via le mini-programme WeChat

小云云

Libérer： 2018-05-24 14:36:52

original

12885 Les gens l'ont consulté

Cet article présente principalement des informations pertinentes sur les exemples détaillés de téléchargement d'avatars dans les mini-programmes WeChat. J'espère que cet article pourra aider tout le monde à réaliser une telle fonction. J'espère qu'il pourra aider tout le monde.

Explication détaillée d'exemples de téléchargement d'avatars dans les mini-programmes WeChat

Récemment, je travaille sur le téléchargement d'avatars et le téléchargement de photos dans les mini-programmes WeChat, donc Je viens d'écrire du code :

Télécharger l'avatar html :

<view class="edit-list">
　　<text class="list-name list-first">头像</text>
　　　　<view class="edit-righr-bar">
　　　　<image class="head-portrait" src="{{avatar}}" bindtap=&#39;changeAvatar&#39;></image>
　　</view>
</view>

Copier après la connexion

code js :

// 切换头像
changeAvatar: function () {
var that = this;
// var childId = wx.getStorageSync("child_id");
// var token = wx.getStorageSync(&#39;token&#39;);
wx.chooseImage({
count: 1, // 最多可以选择的图片张数，默认9
sizeType: [&#39;compressed&#39;], // original 原图，compressed 压缩图，默认二者都有
sourceType: [&#39;album&#39;, &#39;camera&#39;], // 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: &#39;URL地址&#39;,
path: avatar,
header: {
&#39;Content-Type&#39;: &#39;multipart/form-data&#39;,
"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: &#39;fileData&#39;,//这里根据自己的实际情况改
header: data.header,
formData: {
sequence:i+1
},
success: (resp) => {
success++;
console.log(resp)
console.log(i+"成功");
 
 
}
 
},
fail: (res) => {
fail++;
console.log(&#39;fail:&#39; + i + "fail:" + fail);
},
complete: () => {
console.log(i);
i++;
if (i == data.path.length) { //当图片传完时，停止调用
console.log(&#39;执行完毕&#39;);
console.log(&#39;成功：&#39; + success + " 失败：" + fail);
 
} else {//若图片还没有传完，则继续调用函数
console.log(i);
data.i = i;
data.success = success;
data.fail = fail;
that.uploadimg(data);
}

}
});
},

Copier après la connexion

uploadLa soumission du fichier est par défaut la méthode de publication, lors de l'utilisation de l'interface fournie par l'arrière-plan. La publication doit être effectuée en arrière-plan

Recommandations associées :

développement front-end Web télécharger télécharger avatar js exemple de code

Implémentation PHP pour les téléphones mobiles Fonction de prise de photos et de téléchargement d'avatars

PHP ajuste la fonction de téléchargement d'avatars interceptés par Jcrop

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!