上传图片到服务器：
1.先在前端写一个选择图片的区域来触发wx.chooseImage接口并用wx.setStorage接口把图片路径存起来。
2.使用wx.uploadFile将刚才上传的图片上传到服务器上
PS： 微信小程序上传一或多张图片
一.要点
1.选取图片
图片的本地文件路径列表
}
})
2.上传图片
上传文件资源的路径 String类型！！！
name: 'uploadFile',// 文件对应的 key,(后台接口规定的关于图片的请求参数)
header: {
'content-type': 'multipart/form-data'
},// 设置请求的 header
formData: { },// HTTP 请求中其他额外的参数
success: function (res) {
},fail: function (res) {
}
})
二.代码示例
上传图片
upShoplogo: function () {
var that = this;
wx.showActionSheet({
itemList: ['从相册中选择','拍照'],itemColor: "#f7982a",success: function (res) {
if (!res.cancel) {
if (res.tapIndex == 0) {
that.chooseWxImageShop('album')
} else if (res.tapIndex == 1) {
that.chooseWxImageShop('camera')
}
}
}
})
},chooseWxImageShop: function (type) {
var that = this;
wx.chooseImage({
sizeType: ['original',sourceType: [type],success: function (res) {
/*上传单张
that.data.orderDetail.shopImage = res.tempFilePaths[0],that.upload_file(API_URL + 'shop/shopIcon',res.tempFilePaths[0])
*/
/*上传多张（遍历数组，一次传一张）
for (var index in res.tempFilePaths) {
that.upload_file(API_URL + 'shop/shopImage',res.tempFilePaths[index])
}
*/
}
})
},upload_file: function (url,filePath) {
var that = this;
wx.uploadFile({
url: url,filePath: filePath,name: 'uploadFile',header: {
'content-type': 'multipart/form-data'
},// 设置请求的 header
formData: { 'shopId': wx.getStorageSync('shopId') },// HTTP 请求中其他额外的 form data
success: function (res) {
wx.showToast({
title: "图片修改成功",icon: 'success',duration: 700
})
},fail: function (res) {
}
})
},
总结
以上所述是小编给大家介绍的微信小程序上传图片到服务器实例代码。编程之家 jb51.cc 收集整理的教程希望能对你有所帮助，如果觉得编程之家不错，可分享给好友！感谢支持。
原文链接：https://www.f2er.com/weapp/35327.html