小程序
小游戏
企业微信
微信支付
扫描小程序码分享
- 需求的场景描述(希望解决的问题)
- 希望提供的能力
wx.uploadFile上传多张图片
6 个回答
加粗
标红
插入代码
插入链接
插入图片
上传视频
一年多过去了,现在还是没有支持一次性上传多张,写循环一张一张传吧, Page({ data: { }, //选择并上传图片--Max:9张 selectImage: function () { wx.chooseImage({ count: 9, sizeType: ['original', 'compressed'], sourceType: ['album', 'camera'], success: function (res) { //将图片路径循环赋值给filePath参数 for (var i = 0; i < res.tempFilePaths.length; i++) { var imgUrl = res.tempFilePaths[i]; wx.uploadFile({ //上传图片的网路请求地址 url: 'http://localhost:8080//upload/uploadPic', //选择 filePath: imgUrl, name: 'file', success: function (res) { console.log("success"); }, fail: function (res) { console.log("error"); } }); }//for循环结束 } }); console.log("****正在添加图片*****"); }, })
你好,麻烦通过点击下方“反馈信息”按钮,提供出现问题的。
兄弟,问题解决了没有??
叫小姐姐,没得办法,只能一张张上传,写的循环调用上传方法
小姐姐!小姐姐!
上传图片的时候,让后台小伙伴返回了一个id--comment_id,最后页面提交的时候传的这个id过去
chooseImage: function (e) {
let that = this;
wx.chooseImage({
count: 9,
sizeType: ['original', 'compressed'],
sourceType: ['album', 'camera'],
success: function (res) {
var successUp = 0; //成功
var failUp = 0; //失败
var length = res.tempFilePaths.length; //总数
var count = 0; //第几张
that.uploadOneByOne(res.tempFilePaths, successUp, failUp, count, length);
}
})
},
/**
* 采用递归的方式上传
*/
uploadOneByOne(imgPaths,successUp, failUp, count, length){
wx.showLoading({
title: '正在上传',
let _timestamp = timestamp();
wx.uploadFile({
url: 'url',
filePath: imgPaths[count],
id: that.data.order_id,
goods_id: that.data.goods_id,
key:that.data.key,
name: 'file',//示例,使用顺序给文件命名
success:function(e){
successUp++;//成功+1
fail:function(e){
failUp++;//失败+1
complete:function(e){
count++;//下一张
if(count == length){
//上传完毕,作一下提示
if (e.statusCode==200){
that.setData({
comment_id: JSON.parse(e.data).data.id
files: that.data.files.concat(imgPaths)
});
wx.showToast({
title: '上传成功' + successUp,
icon: 'success',
duration: 2000
console.log(that.data.comment_id);
}else{
//递归调用,上传下一张
that.uploadOneByOne(imgPaths, successUp, failUp, count, length);
好的,谢谢小姐姐!
我又找到一个办法!
使用 av-weapp.js
把图片路径转为 可打开的路径,然后用普通的 wx.request 提交就可以了
为啥不支持多张一起上传呢
那失败的怎么重新上传呢
filePath不支持数组对象,我们的接口只能调一次接口上传全部图片 不然就是重复下单,有没有好的解决办法?
1、前端
base64 》》 wx.request 传递json数据 listImgs
2、后台 转换一下
// 图片文件处理
MultipartFile[] imgs = null;
if (listImgs != null && listImgs.size() != 0) {
int size = listImgs.size();
BASE64DecodedMultipartFile base64DecodedMultipartFile = null;
imgs = new MultipartFile[size];
for (int i = 0; i < size; i++) {
base64DecodedMultipartFile = (BASE64DecodedMultipartFile) FileHelper.base64ToMultipart(listImgs.get(i));
if (base64DecodedMultipartFile == null) {
// TODO
imgs[i] = base64DecodedMultipartFile;
多张上传每次也是一张一张传,写个循环就行了~
filePath不支持数组对象,我们的接口只能调一次接口上传全部图片 不然就是重复下单,有没有好的解决办法?大兄弟
关注后,可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
一年多过去了,现在还是没有支持一次性上传多张,写循环一张一张传吧, Page({ data: { }, //选择并上传图片--Max:9张 selectImage: function () { wx.chooseImage({ count: 9, sizeType: ['original', 'compressed'], sourceType: ['album', 'camera'], success: function (res) { //将图片路径循环赋值给filePath参数 for (var i = 0; i < res.tempFilePaths.length; i++) { var imgUrl = res.tempFilePaths[i]; wx.uploadFile({ //上传图片的网路请求地址 url: 'http://localhost:8080//upload/uploadPic', //选择 filePath: imgUrl, name: 'file', success: function (res) { console.log("success"); }, fail: function (res) { console.log("error"); } }); }//for循环结束 } }); console.log("****正在添加图片*****"); }, })
兄弟,问题解决了没有??
叫小姐姐,没得办法,只能一张张上传,写的循环调用上传方法
小姐姐!小姐姐!
上传图片的时候,让后台小伙伴返回了一个id--comment_id,最后页面提交的时候传的这个id过去
chooseImage: function (e) {
let that = this;
wx.chooseImage({
count: 9,
sizeType: ['original', 'compressed'],
sourceType: ['album', 'camera'],
success: function (res) {
var successUp = 0; //成功
var failUp = 0; //失败
var length = res.tempFilePaths.length; //总数
var count = 0; //第几张
that.uploadOneByOne(res.tempFilePaths, successUp, failUp, count, length);
}
})
},
/**
* 采用递归的方式上传
*/
uploadOneByOne(imgPaths,successUp, failUp, count, length){
let that = this;
wx.showLoading({
title: '正在上传',
})
let _timestamp = timestamp();
wx.uploadFile({
url: 'url',
filePath: imgPaths[count],
id: that.data.order_id,
goods_id: that.data.goods_id,
key:that.data.key,
name: 'file',//示例,使用顺序给文件命名
success:function(e){
successUp++;//成功+1
},
fail:function(e){
failUp++;//失败+1
},
complete:function(e){
count++;//下一张
if(count == length){
//上传完毕,作一下提示
if (e.statusCode==200){
that.setData({
comment_id: JSON.parse(e.data).data.id
})
}
that.setData({
files: that.data.files.concat(imgPaths)
});
wx.showToast({
title: '上传成功' + successUp,
icon: 'success',
duration: 2000
})
console.log(that.data.comment_id);
}else{
//递归调用,上传下一张
that.uploadOneByOne(imgPaths, successUp, failUp, count, length);
}
}
})
},
好的,谢谢小姐姐!
我又找到一个办法!
使用 av-weapp.js
把图片路径转为 可打开的路径,然后用普通的 wx.request 提交就可以了
为啥不支持多张一起上传呢
那失败的怎么重新上传呢
filePath不支持数组对象,我们的接口只能调一次接口上传全部图片 不然就是重复下单,有没有好的解决办法?
1、前端
base64 》》 wx.request 传递json数据 listImgs
2、后台 转换一下
// 图片文件处理
MultipartFile[] imgs = null;
if (listImgs != null && listImgs.size() != 0) {
int size = listImgs.size();
BASE64DecodedMultipartFile base64DecodedMultipartFile = null;
imgs = new MultipartFile[size];
for (int i = 0; i < size; i++) {
base64DecodedMultipartFile = (BASE64DecodedMultipartFile) FileHelper.base64ToMultipart(listImgs.get(i));
if (base64DecodedMultipartFile == null) {
// TODO
}
imgs[i] = base64DecodedMultipartFile;
}
}
多张上传每次也是一张一张传,写个循环就行了~
filePath不支持数组对象,我们的接口只能调一次接口上传全部图片 不然就是重复下单,有没有好的解决办法?大兄弟