微信jssdk上传图片java_微信jssdk上传图片

微信jssdk上传图片

时间 ：2019-6-21  评论: [ 0 ] 条  浏览: [ 267 ] 次

本代码在Tp3.2.3上运行成功，若是其他框架 文中的PHP代码可能不会适用，HTML和Javascript代码不受影响，仅作参考！

Html代码：

Javascript代码:

var wx_ok=false;

var conf = JSON.parse('{$wx_js_sign|json_encode=###,true}');

conf.debug = false;

//初始化JS-SDK

JsSdk_Config(conf);

//检测 JS-SDK 能否正常使用

wx.ready(function () {wx_ok=true;})

function JsSdk_Config(conf) {

wx.config({

debug: conf.debug, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。

appId: conf.appId, // 必填，公众号的唯一标识

timestamp: conf.timestamp, // 必填，生成签名的时间戳

nonceStr: conf.nonceStr, // 必填，生成签名的随机串

signature: conf.signature,// 必填，签名

jsApiList: ['startRecord','stopRecord','onRecordEnd','playVoice','pauseVoice','stopVoice','uploadVoice','downloadVoice','chooseImage','previewImage','uploadImage','downloadImage','getNetworkType','onMenuShareTimeline','onMenuShareAppMessage','onMenuShareQQ']

});

}

var wechat_img_id = new Array();

function add_imgs(count = 9,sizeType=['original', 'compressed'],sourceType=['album', 'camera']) {

if(!wx_ok)

{

showMsg('微信还没准备好');

return;

}

wx.chooseImage({

count: count, // 默认9

sizeType: sizeType, // 可以指定是原图还是压缩图，默认二者都有

sourceType: sourceType, // 可以指定来源是相册还是相机，默认二者都有

success: function (res) {

var localIds = res.localIds; // 返回选定照片的本地ID列表，localId可以作为img标签的src属性显示图片

Wechat_Upload(localIds);

}

});

}

//微信端上传图片

function Wechat_Upload(localIds) {

if (!localIds.length) {

return;

} else {

if(wechat_img_id.length < 11)

{

var localId = localIds.pop();remove_img("sss")

wx.uploadImage({

localId: localId,

isShowProgressTips: 1,

success: function(res_data) {

var serverId = res_data.serverId;

wechat_img_id.push(serverId);

var that_box = $('#WxImgBox');

var html='

';

that_box.append(html);

Wechat_Upload(localIds);

}

});

}else{

showMsg('最多上传11张图片');

}

}

}

//移除上传的图片

function remove_img(sid) {

$('.remove_class').on('click',function () {

$(this).remove();

})

removeByValue(wechat_img_id,sid);

}

//删除数组中的值

function removeByValue(arr, val) {

for(var i=0; i

if(arr[i] == val) {

arr.splice(i, 1);

break;

}

}

}

后端使用PHP:

protected function Wechat_img($img)

{

$options=array('token'=>$this->_config['weixin_token'],'encodingaeskey'=>$this->_config['weixin_encodingaeskey'],'appid'=>$this->_config['weixin_appid'],'appsecret'=>$this->_config['weixin_secret']);

$wechatObj=new \Org\Net\TPWechat($options);

$w_img=array();

try {

foreach($img AS $k => $v) {

$media_file=$wechatObj->getXhjMedia($v,false);

if($media_file!==false){

$img_thumb=imgThumb($media_file,300,500);

$w_img[]=array("type"=>"image","img"=>$media_file,"thumb"=>$img_thumb);

}

}

$data['status'] = 1;

$data['data'] = $w_img;

} catch (Exception $err) {

$data['status'] = 0;

$data['info'] = '文件错误：'.$err->getMessage();

}

return $data;

}

期间遇到了一个坑，就是使用'chooseImage'方法后得到localIds再用for循环执行'uploadImage'的方法导致每次都是第一张图片在上传，因为异步的问题所以js代码改成了 最后这个样子 解决了这个异步问题

赞4

踩0

发表评论：

昵称

邮件地址 (选填)

个人主页 (选填)