| 图片上传（调用微信接口） | 您所在的位置：网站首页 › 企业微信上传图片接口 › 图片上传（调用微信接口） |
图片上传（调用微信接口）
|
图片上传之原生方法
图片上传、压缩、回显、缩略图放大、删除、下载，可以参考这儿（h5方法） https://github.com/zhangstar1331/pictureUpload 效果展示 图片上传，我们一般用下面的H5方法，但是在安卓手机上无法一次性上传多张图片。为了能满足情况，如果是微信公众号项目，可以调用微信上传接口来实现。 图片上传之调用微信接口1、h5页面引入微信js 2、调用后台接口，进行微信初始化配置 $.ajax({ url : "/cic-crm-web/cic/getConfig.do", async : true, type : "POST", headers: {"token":token}, data : { "url" : encodeURIComponent(location.href.split('#')[0]) }, dataType : "json", success : function(data) { if (data != null) { conf = {'timestamp':data.timestamp, 'nonceStr':data.nonceStr, 'signature':data.signature}; wx.config({ debug : false, appId : "", timestamp : data.timestamp, //时间戳 nonceStr : data.nonceStr, //随机字符串 signature : data.signature, //得到的签名 jsApiList: ['onMenuShareAppMessage', 'onMenuShareTimeline','chooseImage','previewImage','uploadImage','downloadImage'] // 功能列表，我们要使用JS-SDK的什么功能 }); } } })3、调取摄像头和相册获取图片 $('#idPartView .hidden-input').on('click', wxLoadImage.getImage); var num = 0; //调用微信api获取照片 var wxLoadImage = { picId:null, //获取签名信息 init:function(){}, //调取摄像头和相册获取图片 getImage:function(){ //配置一次最多上传几张图片 var count = 9; wxLoadImage.picId = $(this).parent(); if (wxLoadImage.picId.parent().hasClass('onePicLimit')) { count = 2; } wx.ready(function () { //调取摄像头和相册 var localIds = []; var leng = 0; wx.chooseImage({ count: count, // 默认9 sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有 sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有 success: function (res) { localIds = localIds.concat(res.localIds); // 返回选定照片的本地ID列表，localId可以作为img标签的src属性显示图片 leng = localIds.length; if(window.__wxjs_is_wkwebview){//判断ios是不是用的 wkwebview 内核 for(var i = 0; i < leng; i++ ){ num++; wxLoadImage._getIosImage(localIds[i],num) } }else{ for(var i = 0; i < leng; i++ ){ num++; //安卓这块拿到的是地址，不是base64等具体图片数据 wxLoadImage._showImage(localIds[i],num) } } } }); }) }, //IOS处理 _getIosImage:function(e,num){ var iosLocalId = []; wx.getLocalImgData({ localId: e, // 图片的localID success: function (res) { var localData = res.localData; // localData是图片的base64数据，可以用img标签显示 localData = localData.replace('jgp', 'jpeg');//iOS 系统里面得到的数据，类型为 image/jgp,因此需要替换一下 iosLocalId.push(localData); for(var i = 0; i < iosLocalId.length; i++){ wxLoadImage._showImage(iosLocalId[i],num) } },fail:function(res){ alert("显示失败"); } }); }, //展示图片 _showImage:function(data,num){ var html = ' ';
html += '';
$('body').append(html);
$('#preImg').bind('click', function() {
$('#preImg').hide();
$('#preImg').unbind('click');
$('#preImg').remove();
});
setTimeout(function() {
$('#preImg').show();
}, 200);
} catch (e) {
alert(e.name + ' ' + e.message);
}
});
}
}
|
【本文地址】
公司简介
联系我们