微信jssdk上传多张图片问题

最新推荐文章于 2024-01-19 15:48:59 发布

赵丰登

最新推荐文章于 2024-01-19 15:48:59 发布

阅读量5.2k

点赞数 2

CC 4.0 BY-SA版权

分类专栏：微信

本文链接：https://blog.youkuaiyun.com/zhaofengdeng/article/details/79347240

微信专栏收录该内容

2 篇文章

订阅专栏

本文详细介绍如何使用微信小程序API实现图片的选择、上传及下载功能。通过wx.chooseImage选择图片后，利用递归方式逐张上传，并在上传完毕后下载图片。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

代码逻辑：

1.选择图片调用wx.chooseImage的接口选择图片，成功后返回： res.localIds用于上传图片使用

function selectImage(){
			wx.chooseImage({
			    count: 3, // 默认9
			    sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
			    sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
			    success: function (res) {
					syncUpload(res.localIds)
			    }
			});

2.上传图片因微信上传图片只支持一张一张上传，所以递归调用上传图片

注意：1.不能循环调用

2.第一张上传图片成功后，js定时任务等几毫秒再上传第二张，否则会上传不成功

代码：

		var syncUpload = function(localIds){
		        var localId = localIds.pop();
			wx.uploadImage({
				    localId: localId.toString(), // 需要上传的图片的本地ID，由chooseImage接口获得
				    isShowProgressTips: 1, // 默认为1，显示进度提示
				    success: function (res) {
				        //res.serverId 返回图片的服务器端ID
				        if(localIds.length > 0){
               				 window.setTimeout(function(){
               				  syncUpload(localIds);
    						 },100);
           				 }else{
           				  window.setTimeout(function(){
               				  downloadImage(0);
    					},100);
           					
            			     }
		      }
		}

3.上传完成后，再下载图片