关于使用webuploader插件的踩坑-图片上传缺失

关于什么时候发现这个问题的:项目中有个新增的功能并且需要上传图片,然后发现新增成功之后,图片缺少了几张。
图片上传的一个流程是等新增完数据成功之后返回图片资源id,用作于该数据与图片的一个联系。因为业务需要所以就返回了两个资源id,分别对应两个不同的图片类型,而两种不同的图片类型会有多张图片。

1.数据新增成功之后初始化两个webUploader对象

//这个可以不用看,初始化webUploader对象
uploader1 = webUploader('upload_finance_img','contractIdentityPic',data['contractIdentityPicResult']);
uploader2 = webUploader('upload_finance_img','contractHoursePic',data['contractHoursePicResult']);

2.先定义uploader完成上传后的监听事件

//uploader1
//所有文件上传结束
uploader1.on('uploadFinished', function(){
	//uploder上传完后就开始上传uploder
	uploader2.upload();
});

//uploader2
//所有文件上传结束
uploader2.on('uploadFinished', function(){
	//最后的uploader2上传完毕后刷新页面
	//这个自己定义上传完图片之后的处理
	setTimeout(function() {
		parent.location.reload();
	}, 1000);
});

这一步定义uploader上传完后的一个操作是最重要的,如果没有加上监听事件,可能就会遇到和我一样的错误,图片上传了但是缺少图片。
之前我是没有添加 uploader2的 监听事件-uploadFinished(在uploader2上传成功时触发的事件)导致的出现了问题

3.再开始uploder的文件上传

uploader1.upload();

本博客记录下在工作的时候踩坑一些地方
附带一个关于webuploader文件上传的一些注意事项 ——放一个链接,等有时间再自己整理写个博客

WebUploader文件上传组件使用步骤及注意

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值