微信JS-SDK挑选图片碰到的坑

有个需求要在微信企业号内里做开辟，有个功用是挑选图片，运用input标签肯定是不论用了，Android手机上不能多选，所以运用了微信的JS-SDK供应的相干API，这个处所真的是有坑，纪录一下。根据文档直接引入js文件即可，假如运用的是Vue，也能够运用weixin-js-sdk，两种体式格局都能够。

图片在Android上没法预览

js-sdk的chooseImage 接口返回的结果是localId，类似于wxLocalResource://xxxxxx，假如想获得它的base64串须要再挪用getLocalImgData要领，由于我们背景接口里须要用到这个base64串，所以经由过程这个接口来猎取base64串作展现，而不是用文档里引见的要领。那这里有个坑，从Android猎取的localData是不带有base64前缀的，要处置惩罚一下。

selectImage: function () {
    let context = this;
    wx.chooseImage({
        count: 9,
        sizeType: ['compressed'], 
        sourceType: ['album', 'camera'], 
        defaultCameraMode: "normal", 
        success: function (res) {
            // localIds是在data里定义的一个localId数组
            context.localIds = res.localIds;
            // 不能直接遍历这个数组
            context.updateBase64Data(context.localIds.shift());
        },
        fail: function (res) {
            alert('挑选图片失利:' + res.errMsg);
        },
    });
},
updateBase64Data: function (localId) {
    let context = this;
    wx.getLocalImgData({
        localId: localId, // 图片的localID
        success: function (res) {
            let localData = res.localData;
            let prefix = 'base64,';
            let index = localData.indexOf(prefix);
            let actData = localData;
            // 我现在是设置参数，假如是展现的话则应该是增加头部data:image/jpeg;base64,
            if (index > -1) {
                actData = localData.substring(index + 7);
            }
            // base64Array是在data里定义的一个base64串数组
            context.base64Array.push(actData);
            
            if (context.localIds.length > 0) {
                context.updateBase64Data(context.loaclIds.shift());
            } else {
                // 实行处置惩罚
            }
        },
        fail: function (res) {
            alert('挑选图片失利:' + res.errMsg);
        },
    });
},

getLocalImgData猎取多张图片无相应

chooseImage要领猎取到是一个localId的数组，假如直接遍历这个数组去挪用getLocalImgData时它只会实行一次，背面的无论怎样都不会实行，猜想应该是跟它localId的猎取有关联。所以采取了上面代码中递归的体式格局挪用，当一连挪用uploadImage上传图片时也要这么做。

Android没法挑选原图

只管在chooseImage要领能够经由过程sourceType字段指定是原图照样紧缩后的图，然则只需挪用了getLocalImgData要领，那猎取到的base64串展现一定是隐约的。你在想是否是Android上面不能运用原图啊，错了，仔细看IOS上面的图也是不清楚的，测试发明确实是如许，原图1.8M，运用js-sdk挑选的原图只要不到240K，那为何Android会隐约然则IOS比较清楚呢，你是否是又想这不是IOS和Android体系的区分吧，把统一张图片经由过程getLocalImgData要领猎取到的base64串做比对发明，Android上获得的base64串前缀是以gCM开首，而IOS则是以/9j/开首，从PC上挑选的图也是以/9j/开首，本身剖析的图片也是以/9j/开首，所以不是由于紧缩变隐约了，是由于运用了不一样的编码变隐约了。假如真的想挑选原图，先把图片上传到微信服务器，然后运用猎取暂时素材的接口https://qyapi.weixin.qq.com/cgi-bin/media/get?access_token=ACCESS_TOKEN&media_id=MEDIA_ID，把图片下载下来，经测试如许实在也是有紧缩的，这个是企业号的API假如用民众号地点是https://api.weixin.qq.com/cgi-bin/media/get?access_token=ACCESS_TOKEN&media_id=MEDIA_ID。代码就不贴了，与上面的基础一致。