收藏
回答

微信公众号网页开发,选择本地图片预览都正常,上传时存储图片列表的集合读不到数据?

场景:公众号网页端需要上传图片,先通过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);
  }
});


回答关注问题邀请回答
收藏

1 个回答

登录 后发表内容
问题标签