场景:公众号网页端需要上传图片,先通过JS-SDK预览选中的手机本地图片,点击上传按钮触发图片时,存储本机图片列表的集合获取不到数据。
业务代码:
// localIds 存储图片列表的集合
var localIds = [];
// btn-sel-pic 是触发选择上传本机图片的按钮(选中图片后,会在按钮前回显所有选中的图片列表)
$("#btn-sel-pic").click(function () {
wx.chooseImage({
count: 9,
sizeType: ['compressed'],
sourceType: ['album'],
success: function (res) {
localIds = res.localIds;
for (var i = 0; i < localIds.length; i++) {
img = "<div class='div_img'><img src='" + localIds[i] + "'></div>";
$("#btn-sel-pic").before(img);
}
}
});
});
// btn-upload 执行图片上传的触发按钮
$("#btn-upload").click(function () {
if (localIds.length == 0) {
/**
* 出现问题的地方
* 详细说明:
* 1. 在wx.chooseImage中,将res.localIds的图片集合存储在全局变量localIds中。
* 2. 循环了全局变量localIds集合,并且对图片在页面进行回显,回显正常。
* 3. 触发上传按钮时,全局变量localIds集合长度判断为空了,提示至少要选择一张图片。
* 4. 整体流程是连贯的,也就是预览完本地图片,本机图片在页面回显成功,执行图片上传。中间无停顿。图片选择1张或多张都无效。
并且选择任何图片都会出现这个问题。
* 5. 该问题在个别用户手机上会偶然发生(也就是说之前都可以正常上传,突然就不行了),出现问题后,杀死微信进程重新打开微信,
进入公众号功能网页执行以上操作,问题仍然存在。
* 6. 出现该问题的用户,最终重启手机以后,进入微信公众号功能页面,再次执行以上流程才能正常上传图片。
*
*/
alert("至少需要选择一张图片");
return;
} else {
// syncUpload 是上传多张图片的封装方法,上传图片正常,就不贴详细代码了。
syncUpload(localIds);
}
});
你好,麻烦提供下控制台Debug截图,控制台打印下相关参数