1.页面样式和需要加载微信js
<p><img src="http://www.likecs.com/gv/mine/images/img_info.png" alt=""></p>
<script type="text/javascript" src="http://www.likecs.com/js/jweixin-1.2.0.js"></script>
2.js代码
/** ******************获取微信配置数据********************** */
var oldNet = \'\';
var newNet = \'\';// 记录网络状态
var configData;
$.ajax({
url: Url + \'weChat/getSignatureInfo\',//调用微信的接口
data: {pageUrl: location.href.split(\'#\')[0]},
success: function (data) {
configData = {
debug : false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
appId: data.appid, // 必填，公众号的唯一标识
timestamp: data.timestamp, // 必填，生成签名的时间戳
nonceStr: data.nonceStr, // 必填，生成签名的随机串
signature: data.signature,// 必填，签名，见附录1
jsApiList : [ \'chooseImage\', \'previewImage\',\'uploadImage\', \'downloadImage\' ]
// 必填，需要使用的JS接口列表，所有JS接口列表见附录2
};
wx.config(configData);
wx.ready(function () {
wx.getNetworkType({
success: function (res) {
oldNet = res.networkType; // 返回网络类型2g，3g，4g，wifi
}
});
// 拍照选图片一
document.querySelector(\'.head_portrait\').onclick = function (){
var img1=$(\'#chooseImage1\');
wx.chooseImage({
count: 1, // 默认9
sourceType: [\'album\', \'camera\'],
success: function (res) {
var imgLocalId = res.localIds;//本地地址
if(!imgLocalId){
fnPicInfo(\'\',imgLocalId,\'choose\',\'fb\',JSON.stringify(res));
}
wx.uploadImage({
localId: imgLocalId[0], // 需要上传的图片的本地ID，由chooseImage接口获得
isShowProgressTips: 1, // 默认为1，显示进度提示
success: function (res) {
if(res.serverId.indexOf("wxLocalResource://")>=0){
mui.alert(\'\',"图片上传失败，请重新上传！",\'\');
return;
}
mediaId = res.serverId;
if(!mediaId){
fnPicInfo(mediaId,imgLocalId,\'upload\',\'fb\',JSON.stringify(res));
}
img1.attr(\'src\',imgLocalId);
mediaId1=mediaId;
localId1=imgLocalId;
},
fail: function(re){
wx.getNetworkType({
success: function (res) {
$(\'.hidden_word1\').show();
newNet = res.networkType; // 返回网络类型2g，3g，4g，wifi
fnPicInfo(\'\',\'\',\'upload\',\'fb\',re);
}
});
}
});
},
fail: function(re){
alert(JSON.stringify(re));
wx.getNetworkType({
success: function (res) {
$(\'.hidden_word1\').show();
newNet = res.networkType; // 返回网络类型2g，3g，4g，wifi
fnPicInfo(\'\',\'\',\'choose\',\'fb\',re);
}
});
}
});
};
//拍照选择图片二
document.querySelector(\'#chooseImage2\').onclick = function (){
var img2=$(\'#chooseImage2\');
wx.chooseImage({
count: 1, // 默认9
sourceType: [\'album\', \'camera\'],
success: function (res) {
var imgLocalId = res.localIds;
if(!imgLocalId){
fnPicInfo(\'\',imgLocalId,\'choose\',\'fb\',JSON.stringify(res));
}
wx.uploadImage({
localId: imgLocalId[0], // 需要上传的图片的本地ID，由chooseImage接口获得
isShowProgressTips: 1, // 默认为1，显示进度提示
success: function (res) {
if(res.serverId.indexOf("wxLocalResource://")>=0){
mui.alert(\'\',"图片上传失败，请重新上传！",\'\');
return;
}
mediaId = res.serverId;
if(!mediaId){
fnPicInfo(mediaId,imgLocalId,\'upload\',\'fb\',JSON.stringify(res));
}
img2.attr(\'src\',imgLocalId);
mediaId2=mediaId;
localId2=imgLocalId;
},
fail: function(re){
wx.getNetworkType({
success: function (res) {
$(\'.hidden_word2\').show();
newNet = res.networkType; // 返回网络类型2g，3g，4g，wifi
fnPicInfo(\'\',\'\',\'upload\',\'fb\',re);
}
});
}
});
},
fail: function(re){
alert(JSON.stringify(re));
wx.getNetworkType({
success: function (res) {
$(\'.hidden_word2\').show();
newNet = res.networkType; // 返回网络类型2g，3g，4g，wifi
fnPicInfo(\'\',\'\',\'choose\',\'fb\',re);
}
});
}
});
};
})
}
});
// 照片信息 返给后台查看信息的
function fnPicInfo(sId,lId,opType,businessType,remark) {
remark+="||"+oldNet+"||"+newNet;
$.ajax({
url:Url+\'maintainCommon/addWXMediaRecord\',
data:{
serviceId:sId,
localId:lId,
clientType:navigator.userAgent,
opType:opType,
businessType:businessType,
remark:remark
}
});
}