//html模板
<div class="zhaopin_3_2">
<div id="bbb"></div>
<img src="/Public/Home/images/jia.png" class="avatar-round1">
</div>
此方法是一次可多张上传
//js控制
{:wx_jssdk_config("false")}
<script>
var headimgurl;
var y=0;
var i =0;
$(‘.avatar-round1‘).click(function(){
if(y<5){
var html = $(‘#bbb‘).html();
wx.chooseImage({
count: 5-i,
success: function (res) {
var localIds = res.localIds;
syncUpload(localIds);
}
});
var syncUpload = function(localIds){
var localId = localIds.pop();
wx.uploadImage({
localId: localId,
isShowProgressTips: 1,
success: function (res) {
i++;
var serverId = res.serverId; // 返回图片的服务器端ID
html += ‘<div class="uploadImg img"><div class="close"><img src="__HOME__/images/close.png" onclick="del_imgy(this);"> </div>‘+
‘<img src="‘+localId+‘"/><input type="hidden" name="image[]" value="‘+serverId+‘"></div>‘;
//其他对serverId做处理的代码
if(localIds.length > 0){
syncUpload(localIds);
}else{
$(‘#bbb‘).html(html);
}
}
});
};
}
});
function del_img(dom){
$(dom).parents(‘.uploadImg‘).remove();
}
</script>
//此方法可一张一张的上传
{:wx_jssdk_config("false")}
<script>
var headimgurl;
$(‘.avatar-round1‘).click(function(){
wx.chooseImage({
count: 1, // 默认9
sizeType: [‘original‘, ‘compressed‘], // 可以指定是原图还是压缩图,默认二者都有
sourceType: [‘album‘, ‘camera‘], // 可以指定来源是相册还是相机,默认二者都有
success: function(res) {
var localIds = res.localIds; // 返回选定照片的本地ID列表,localId可以作为img标签的src属性显示图片
// 上传照片
wx.uploadImage({
localId: ‘‘ + localIds,
isShowProgressTips: 1,
success: function(res) {
serverId = res.serverId;
$(localIds).each(function(index, el) {
iii=localIds[index];
});
var html = $(‘#bbb‘).html();
html += ‘<div class="uploadImg img" id="tuji"><div class="close"><img src="__HOME__/images/close.png" onclick="del_img(this);"> </div>‘+
‘<img src="‘+iii+‘"><input type="hidden" name="image[]" value="‘+serverId+‘"></div>‘;
$(‘#bbb‘).html(html);
}
});
}
});
});
function del_img(dom){
$(dom).parents(‘.uploadImg‘).remove();
}
</script>
下面使用的方法都是一样的
//封装的方法
//我的是放在 function.php文件里
//下面这两个方法需要用到微信的配置
/**
* 直接生成微信jssdk_config
* @echo string $jssdk Jssdk_config
* @author 5heAtMin9 <sheatming@foxmail.com>
*/
function wx_jssdk_config($debug=‘true‘){
$getSignPackage = wx_getSignPackage();
$jssdk = ‘<script src="https://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>‘;
$jssdk .= ‘<script>
wx.config({
debug: ‘.$debug.‘,
appId: "‘.$getSignPackage[‘appId‘].‘",
timestamp: "‘.$getSignPackage[‘timestamp‘].‘",
nonceStr: "‘.$getSignPackage[‘nonceStr‘].‘",
signature: "‘.$getSignPackage[‘signature‘].‘",
jsApiList: ["checkJsApi","onMenuShareTimeline","onMenuShareAppMessage","onMenuShareQQ", "onMenuShareWeibo","onMenuShareQZone","hideMenuItems","showMenuItems","hideAllNonBaseMenuItem","showAllNonBaseMenuItem","translateVoice","startRecord","stopRecord","onVoiceRecordEnd","playVoice","onVoicePlayEnd","pauseVoice","stopVoice","uploadVoice","downloadVoice","chooseImage","previewImage","uploadImage","downloadImage","getNetworkType","openLocation","getLocation","hideOptionMenu","showOptionMenu","closeWindow","scanQRCode","chooseWXPay","openProductSpecificView","addCard","chooseCard","openCard"],
});
</script>‘;
echo $jssdk;
}
//控制器里需要用到此方法
/**
* 保存图片、视频、语音消息
* @param string $media_id 素材ID
* @param string $save_path 保存路径
* @return string $return 返回jpg文件路径
* @author 5heAtMin9 <sheatming@foxmail.com>
*/
function wx_msg_save_file($media_id, $msgtype, $save_path=‘./Uploads/Wechat/‘)
{
switch($msgtype){
case ‘image‘:
$save_path .= ‘image/‘;
$ex = ‘.jpg‘;
break;
case ‘video‘:
$save_path .= ‘video/‘;
$ex = ‘.mp4‘;
break;
case ‘voice‘:
$save_path .= ‘voice/‘;
$ex = ‘.amr‘;
break;
default : return ‘参数错误‘; break;
}
if(!is_dir($save_path)){
mkdir($save_path);
}
$url = ‘http://file.api.weixin.qq.com/cgi-bin/media/get?access_token=‘.wx_get_access_token() -> access_token.‘&media_id=‘.$media_id;
$filename = $msgtype."_".rand(1111,9999).time().$ex;
downAndSaveFile($url,$save_path.$filename);
$ready_upload = $save_path.$filename;// 文件在本地的位置
return $ready_upload;
}
//在控制器里需要这样用
if(I(‘image‘)!=‘‘){
foreach(I(‘image‘) as $k=>$v){
$aa[$k]=wx_msg_save_file($v, ‘image‘);
}
$_POST[‘picture‘]=implode(‘,‘,$aa);
}
