微信---上传图片

  1. 在html中引入

  1. 从后端获取微信配置的数据
wx.config({
            debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
            appId: data.data.appId, // 必填,公众号的唯一标识
            timestamp: parseInt(data.data.timestamp), // 必填,生成签名的时间戳
            nonceStr: data.data.nonceStr, // 必填,生成签名的随机串
            signature: data.data.signature, // 必填,签名,见附录1
            jsApiList: ['chooseImage', 'uploadImage', 'downloadImage'], // 必填,需要使用的JS接口列表,所有JS接口列表见附录2
        });
  1. 选择图片
wx.chooseImage({
            count: 6 - countLength,
            sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有
            sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有
            success: function (data) {
                // localIds = data.localIds[0].toString(); // 返回选定照片的本地ID列表,localId可以作为img标签的src属性显示图片
                console.log(localIds);
                localIds = data.localIds;
                countLength = data.localIds.length;
                // 本地展示图片
                data.localIds.forEach(element => {
                    $(".lastLi").before('
  • '); }); }, fail: function (res) { // alterShowMessage("操提示", JSON.stringify(res), "1", "确定", "", "", ""); } });
    1. 上传图片
    上传兼容ios:
    if (window.__wxjs_is_wkwebview) {
                wxgetLocalImgData(localIds);
            } else {
                localIds.forEach((item, index) => {
                    // localIdImgs.push(item);
                    // if (localIdImgs.length >= imgaesMaxLenght) {
                    //     imgLenght = false
                    // }
                });
            }
           wxuploadImage(localIds);
    
    
    
    function wxuploadImage(localIds) {
        let i = 0; let length = localIds.length;
        let upload = function () {
            let loacId = localIds[i];
            if (window.__wxjs_is_wkwebview) {
                if (loacId.indexOf("wxlocalresource") != -1) {
                    loacId = loacId.replace("wxlocalresource", "wxLocalResource");
                }
            }
            wx.uploadImage({
                localId: loacId, // 需要上传的图片的本地ID,由chooseImage接口获得
                isShowProgressTips: 0, // 默认为1,显示进度提示
                success: function (res) {
                    serverIdData.push(res.serverId);
                    i++;
                    i < length ? upload() : uploadBack(serverIdData);
                },
                fail: function (error) {
                    alert("失败11")
                }
            });
        }
    function wxgetLocalImgData(localIds) {
        let i = 0; let length = localIds.length;
        let upload = function () {
            wx.getLocalImgData({
                localId: localIds[i], // 图片的localID
                success: function (res) {
                    let localData = res.localData; // localData是图片的base64数据,可以用img标签显示
                    localData = localData.replace('jgp', 'jpeg');
                    // localIdImgs.push(localData);
                    // if (localIdImgs.length >= imgaesMaxLenght) {
                    //     imgLenght = false
                    // }
                    i++;
                    i < length && upload();
                }
            });
        }
        upload();
    }
    

    你可能感兴趣的:(微信---上传图片)