微信JSSDK上傳多張圖片
阿新 • • 發佈:2019-02-06
做過微信開發的都知道,在部分android機型裡微信不支援網頁上傳圖片的,這是由於這些機型的檔案上傳存在記憶體洩漏,會導致微信閃退,所以微信內建瀏覽器將檔案上傳遮蔽。這就導致這些機型的使用者在使用微信瀏覽器訪問某些需要上傳圖片的網頁時功能不正常。
前不久微信公開了一些介面,其中有一個uploadImage介面用於上傳圖片,一般和chooseImage介面配合使用。先呼叫chooseImage介面讓使用者選擇一張或者多張圖片,使用者選擇完畢後微信會返回被選中圖片的id,再把圖片id傳給uploadImage介面上傳圖片。
由於uploadImage一次只能上傳一張圖片,因此當用戶選擇多張圖片時,需要多次呼叫uploadImage介面來上傳圖片。 微信
但是在實踐的過程中發現,不管使用者選中多少張圖片,只有第一張能夠上傳成功。
查看了一下微信的文件,在常見問題中找到了相關的描述
uploadImage怎麼傳多圖(目前只支援一次上傳一張,多張圖片需等前一張圖片上傳之後再呼叫該介面)
也就是說,如果想要上傳多張圖片,需要將之前並行上傳改成序列。
程式碼如下:
01 |
$( '#filePicker' ).on( 'click' , function ()
{ |
02 |
wx.chooseImage({ |
03 |
success: function (res)
{ |
04 |
var localIds
= res.localIds; |
05 |
syncUpload(localIds); |
06 |
} |
07 |
}); |
08 |
}); |
09 |
var syncUpload
= function (localIds){ |
10 |
var localId
= localIds.pop(); |
11 |
wx.uploadImage({ |
12 |
localId:
localId, |
13 |
isShowProgressTips:
1, |
14 |
success: function (res)
{ |
15 |
var serverId
= res.serverId; //
返回圖片的伺服器端ID |
16 |
//其他對serverId做處理的程式碼 |
17 |
if (localIds.length
> 0){ |
18 |
syncUpload(localIds); |
19 |
} |
20 |
} |
21 |
}); |
22 |
}; |